Raster 0.2

A design system with one ink.

Raster is monochrome, CSS-first, and dependency-free. Tokens, components, a typed registry, and a CLI that copies source into your project.

npx raster init && npx raster add button dialog

The palette is monochrome: paper, ink, and the grays between. Emphasis comes from weight, size, and spacing.

Rows and dividers are 1px lines on the open grid; cells and cards avoid heavy chrome.

A 204px module draws faint lines across every page; content boxes span whole modules so edges step from grid line to grid line.

Plain classes on plain markup. The React layer uses native elements. No Radix, no Tailwind.

Labels and eyebrows are sentence case. Never all caps.

0.15–0.3s, ease. Color and opacity change; layout rarely moves; nothing bounces.

The kit

Solid ink primary and hairline ghost. One primary per view. 40px tall; 36px small variant.

32×18 pill; on is ink, off is hairline. State moves, layout doesn't.

E-mail

Quiet field: hairline border, ink focus, label above at 12px.

Active tab is ink with a 1.5px underline.

Closed trigger with chevron; the open menu overlays instead of pushing layout.

RecommendedDeliveredIn progress

Outline for recommendations, solid for done, muted for pending.