Loader
Loader components: compare
Every Loader component side by side: whether it follows the theme or stays dark, how many parts and custom props it has, and whether it is free. Open one for its preview, API and install.
Compare
| Component | Theme | Parts | Custom props | Access |
|---|---|---|---|---|
| Bar Wave Loader | Light and dark | 1 | 2 | Licensed |
| Breathe Loader | Light and dark | 1 | 2 | Licensed |
| Cloud Stack Loader | Light and dark | 1 | 2 | Free |
| Crescent Spin Loader | Light and dark | 1 | 2 | Licensed |
| Dot Wave Loader | Light and dark | 1 | 2 | Licensed |
| Eclipse Loader | Light and dark | 1 | 2 | Licensed |
| Orbit Loader | Light and dark | 1 | 2 | Licensed |
| Ring Loader | Light and dark | 1 | 2 | Free |
| Rothko Loader | Light and dark | 1 | 5 | Licensed |
| Rothko Progress | Light and dark | 1 | 3 | Licensed |
| Rothko Skeleton | Light and dark | 1 | 4 | Licensed |
| Void Orbit Loader | Light and dark | 1 | 2 | Licensed |
| Void Transit Loader | Light and dark | 1 | 2 | Licensed |
All Loader components
13 components, A to Z.
Bar Wave LoaderLicensedRow of five paper-lit pill bars that rise and fall in a staggered wave, each tinted by its own palette. A status element labelled Loading; reduced motion swaps the wave for a slow fade.
Breathe LoaderLicensedSingle paper-lit sphere with a crescent tint that slowly swells and settles on a three-second loop. Sized in pixels; reduced motion replaces the scale change with an opacity fade.
Cloud Stack LoaderFreeVertical column of three paper circles that take their color in turn from top to bottom while the others rest in grey. Height sets the size; reduced motion fades instead of scaling.
Crescent Spin LoaderLicensedPaper-lit sphere with a round bite masked out, spinning as a crescent that works on any background. A Loading status sized in pixels; reduced motion turns the spin into a fade.
Dot Wave LoaderLicensedRow of four small paper-lit dots that hop in a staggered wave, each in its own tint. Sized by height; reduced motion replaces the hop with an opacity fade.
Eclipse LoaderLicensedPaper-lit sphere crossed by a dark void disc that slides in, pauses to cover it and slides out on a four-second loop. Sized in pixels; reduced motion fades the void in place.
Orbit LoaderLicensedPaper-lit centre sphere circled by three small moons on one orbit, the first tinted to match the centre. The moons keep their spacing when still; reduced motion fades them in sequence.
Ring LoaderFreeThin ring spinner in five variants, portal, arc, orbit, pulse and crescent, painted from a dusty rose and teal trio set as CSS variables. Reduced motion swaps every spin for a slow breath.
Rothko LoaderLicensedSmall Rothko-style canvas of two color fields on a ground, breathing under grain and crossfading through any palettes you pass. Three sizes and a grisaille option; client component, reduced motion keeps only the fade.
Rothko ProgressLicensedProgress bar drawn as a Rothko canvas whose lower field rises with the value while its color develops from grey to full chroma. Exposes progressbar semantics with a 0 to 100 value.
Rothko SkeletonLicensedLoading placeholder of pulsing bars on a Rothko ground that waits in grisaille and glazes the palette color in when switched to colored. Line count is adjustable; the pulse is opacity only.
Void Orbit LoaderLicensedDark void sphere at the centre with two paper-lit orbs circling it on counter-rotating orbits. Sized in pixels; reduced motion turns the orbits into alternating fades.
Void Transit LoaderLicensedPaper-lit sphere crossed diagonally by a dark void that grows as it covers the disc and shrinks as it leaves. Sized in pixels; reduced motion fades the void instead of moving it.
Transit Light Curve
An SVG light curve in currentColor with a dot riding its dip, driven by the same clock as Planet Transit Scene. Render both from one parent so the dip matches the crossing.
Bar Wave Loader
Row of five paper-lit pill bars that rise and fall in a staggered wave, each tinted by its own palette. A status element labelled Loading; reduced motion swaps the wave for a slow fade.