Loaders
Atelier Character Loader
Five-cell split-flap mechanical character spinner with hardware center crease and interactive sync pause control.
csslight complexitymoderate motionpointer+keyboardaccessible
Open on the canvas to copy the code → Free account · 3 copies a day · membership goes unlimited
1
When to use it
Working with an AI agent
Every component ships agent-ready metadata. An example instruction for this one:
Keep visibilitychange interval cleanup and reduced-motion pause behavior intact.
Safe to edit
- tokens
- glyphs
Keep intact
- visibilitychange
More Loaders components
- Morphing BlobAurora-gradient blob slowly morphs border-radius and rotates, with an inset dark ghost layer counter-rotating. Soft glow on dark backdrop.
- DNA HelixTwo columns of 10 glowing dots swing left-right in opposite phases, tracing a rotating DNA double helix. Cycling status messages fade in below.
- Skeleton ShimmerDark content-placeholder card with avatar circle and staggered text bars swept by a looping gold-to-tan shimmer gradient. Pure CSS, no JS logic.
- Particle Orbit18 glowing iris, cyan, and magenta particles orbit a white core on wobbling elliptical paths; trailing fill creates a comet-like motion blur effect.
- Concentric PulseFour concentric rings ripple outward in staggered teal, tan, and slate waves from a beating gradient core dot on a dark background.
- Equalizer BarsSeven pill-shaped vermillion-to-tan gradient bars bounce at staggered offsets, mimicking an audio equalizer. Pure CSS scaleY animation.