Dither Field

A breathing field of dithered light: the theme's gradient tokens quantized through a Bayer matrix, with the color slowly drifting under a fixed pixel grain, like weather behind a screen door.

Draw

draw a card

$npx shadcn@latest add @clow/dither-field

First time? Point @clow at the registry

Once per project, add the registry to your components.json. Then draw any card by name.

"registries": {
  "@clow": "https://clow.cards/r/{name}.json"
}

Full setup →

Playground

Weather on the mesh

The sun roams under a fixed pixel grain.

props

field

animate

<DitherField />

Examples

basic

Signal weather

The grain holds still while the light drifts underneath it.

Props

prop	type	default
field	warm \| cool \| ember	warm
animate	boolean	true