Small 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.
The source comes with full access.
One payment of $149 ($49 for now) opens the source right here and lets the CLI install every paid component, with lifetime updates.
pnpm dlx shadcn add @01orbital/rothko-loadernpx shadcn add @01orbital/rothko-loaderyarn shadcn add @01orbital/rothko-loaderbunx --bun shadcn add @01orbital/rothko-loaderPart of the 01orbital library. With a license, put ORBITAL_TOKEN in .env.local and the same command installs it (licensed install, pricing).
It lands at components/loader/rothko-loader.tsx, as source you own and edit.
import { RothkoLoader } from "@/components/loader/rothko-loader"
export default function RothkoLoaderDemo() {
return <RothkoLoader size="md" />
}Prop
Type
It also accepts the HTML attributes of the element it renders.
npm: cn. The CLI installs them for you.
No other registry pieces.
Ring Loader
Thin 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 Progress
Progress 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.