Getting started

1. Initialize

npx @noordvc/raster-cli init

Writes styles/raster.css (tokens, Inter, base styles, component classes), the Inter files, and raster.json. Link the stylesheet or import it in your root layout. Set data-theme="dark" on the root element for the dark scheme.

2. Add components

npx @noordvc/raster-cli add button dialog switch

Copies React source into components/raster/. Registry dependencies install with it; dialog pulls button. CSS-only components need no code, the classes are already in raster.css; add prints the snippet.

Using shadcn's CLI instead

npx shadcn add https://raster.noord.dev/r/button.json

Each component is also a shadcn registry item at https://raster.noord.dev/r/<name>.json, on the host we run today.

The typeface

Raster is set in Inter (SIL OFL 1.1). The variable face, latin + latin-ext, is bundled. System sans is fallback only. Weights: 500 body, 600 headings and labels.

Coming from Raster 0.1

npx @noordvc/raster-cli init --compat

0.2 renamed every class to the rs- prefix. The compat flag also writes raster-compat.css, which keeps the 0.1 names (bb-*, lib-*, bare table) working.