Scalable Vector Graphics (SVGs) are flexible, performant, and powerful, but accessibility needs go beyond screen reader patterns and code compliance. This talk explores how color, contrast, animation, dark mode, and reduced motion affect real users, and how designers and developers can create more inclusive SVG experiences.
Resources
- BADCamp 2020 (opens in new tab) - Conference
- Light/Dark mode with SVGs (opens in new tab) - CodePen
- Reduced motion with SVGs (opens in new tab) - CodePen
- Light/Dark mode + reduced motion with SVGs (Karma Chameleon) (opens in new tab) - CodePen
- Accessible SVGs: inclusiveness beyond patterns (opens in new tab) - Smashing Magazine