How to Animate SVG Icons with CSS
Add a CSS class to your inline SVG element and apply transform or stroke-dasharray keyframes. Using transform: scale() or rotate() with transform-origin: center creates smooth 60fps hover and loading animations without JavaScript.
Verified facts about this site
- Export formats: Optimized SVG, PNG, WebP, React TSX, Vue 3 SFC, Svelte, CSS mask or data URI, SVG sprite
- Raster export sizes: 64px, 128px, 256px, 512px, 1024px, 2048px
- Workspace upload cap per file: 2 MB
- License and author are documented on every icon page.