n3r4zzurr0 / svg-spinners
A collection of 24 x 24 dp SVG spinners! (CSS & SMIL)
AI Architecture Analysis
This repository is indexed by RepoMind. By analyzing n3r4zzurr0/svg-spinners in our AI interface, you can instantly generate complete architecture diagrams, visualize control flows, and perform automated security audits across the entire codebase.
Our Agentic Context Augmented Generation (Agentic CAG) engine loads full source files into context on-demand, avoiding the fragmentation of traditional RAG systems. Ask questions about the architecture, dependencies, or specific features to see it in action.
Repository Summary (README)
Preview
SVG Spinners (CSS & SMIL)
All spinners are displayed inside a 24 x 24 dp view box. The main content rests inside the live area of 22 dp with a padding of 1dp.
Few points to consider:
- SMIL animations (both inline and referenced via an
imgtag) won't start playing until the page has completely loaded whereas CSS animations will start playing while the page is loading. - In webkit based browsers, both SMIL and CSS animations, when referenced via an
imgtag, produce an unusual behavior on page zoom levels other than 100%. Using them inline seems completely fine and consistent across browsers.
Preview
Rings
| Preview | CSS (Size in bytes) | SMIL (Size in bytes) |
|---|---|---|
| CSS (428) | SMIL (384) | |
| CSS (531) | SMIL (487) | |
| CSS (434) | SMIL (390) | |
| CSS (537) | SMIL (493) | |
| CSS (483) | SMIL (439) | |
| CSS (586) | SMIL (542) | |
| CSS (620) | SMIL (739) |
Dots
| Preview | CSS (Size in bytes) | SMIL (Size in bytes) |
|---|---|---|
| CSS (635) | SMIL (686) | |
| CSS (482) | SMIL (599) | |
| CSS (631) | SMIL (2973) | |
| CSS (409) | SMIL (375) | |
| CSS (471) | SMIL (503) | |
| CSS (422) | SMIL (459) | |
| CSS (948) | SMIL (692) | |
| CSS (1494) | SMIL (2875) | |
| CSS (1504) | SMIL (2587) | |
| CSS (535) | SMIL (484) | |
| CSS (1693) | SMIL (2714) | |
| CSS (399) | SMIL (357) |
Bars
| Preview | CSS (Size in bytes) | SMIL (Size in bytes) |
|---|---|---|
| CSS (514) | SMIL (625) | |
| CSS (895) | SMIL (1891) | |
| CSS (548) | SMIL (1244) | |
| CSS (825) | SMIL (1891) | |
| CSS (1150) | SMIL (894) |
Blocks
| Preview | CSS (Size in bytes) | SMIL (Size in bytes) |
|---|---|---|
| CSS (1182) | SMIL (2133) | |
| CSS (524) | SMIL (1082) | |
| CSS (646) | SMIL (1579) | |
| CSS (2457) | SMIL (4106) |
Pulses
| Preview | CSS (Size in bytes) | SMIL (Size in bytes) |
|---|---|---|
| CSS (301) | SMIL (381) | |
| CSS (400) | SMIL (797) | |
| CSS (499) | SMIL (1149) | |
| CSS (503) | SMIL (1135) | |
| CSS (461) | SMIL (683) | |
| CSS (657) | SMIL (1361) | |
| CSS (853) | SMIL (1994) | |
| CSS (856) | SMIL (1973) |
Other
| Preview | CSS (Size in bytes) | SMIL (Size in bytes) |
|---|---|---|
| CSS (453) | SMIL (870) | |
| CSS (565) | SMIL (530) | |
| CSS (377) | SMIL (333) | |
| CSS (385) | SMIL (341) | |
| CSS (774) | SMIL (1028) | |
| CSS (1064) | SMIL (853) | |
| CSS (398) | SMIL (354) | |
| CSS (999) | SMIL (1238) | |
| CSS (989) | SMIL (1172) | |
| CSS (1321) | SMIL (1276) |
Adaptation
React Component Library by dephraiim
License
MIT © Utkarsh Verma