Tokens
Radius.
Aligned to Tailwind v4 / Nuxt UI. Brand-specific tokens (1px escape hatch, ui base) live in @dinette/ui; the rest are Tailwind defaults.
| Token | Tailwind | Value | Sample | Used for |
|---|---|---|---|---|
| --radius-px | rounded-[1px] | 1px | Calendar day cells (brand escape hatch) | |
| --radius-xs | rounded-xs | 2px | — | |
| --radius-sm | rounded-sm | 4px | === --ui-radius (Nuxt UI base) | |
| --radius-md | rounded-md | 6px | Form inputs | |
| --radius-lg | rounded-lg | 8px | Avatars, thumbnails, hatched tiles | |
| --radius-xl | rounded-xl | 12px | Cards (chef, menu, review, source-tile) | |
| --radius-2xl | rounded-2xl | 16px | Booking card · hero search bar | |
| --radius-3xl | rounded-3xl | 24px | — | |
| --radius-full | rounded-full | 9999px | Chips · primary button · avatars |