Before building Loader Generator, we pulled the actual generated code from a well-known CSS spinner generator — one with 54 pages of different spinner styles — to see exactly what a developer copies and pastes.
The whole output is a div
The code we extracted was <div class="spinner"></div>, plus a CSS animation. No role="status". No aria-label. No hidden text announcing anything to a screen reader. If you're using a screen reader and land on a page mid-load, that div spins in complete silence — nothing tells you a process is even running.
No opt-out for motion sensitivity, either
The same code had no @media (prefers-reduced-motion: reduce) block. Spinning and pulsing animations are a documented real problem for people with vestibular disorders — disorienting, sometimes nauseating — and reduced motion is exactly the browser-level signal designed to let a user opt out of it. Without that block, the animation runs regardless of what the user asked their OS to do.
Accessible by default, not by exception
Every snippet this tool generates — across all five spinner styles — wraps the visual spinner in role="status" aria-live="polite", includes a visually hidden "Loading…" label, and ships a prefers-reduced-motion block that turns the animation off. Not an option to remember to add later — it's just what gets copied.
