Browse the docs
FoundationsNo. 06 of 145
Theme: Violet
The Corsair theme on a zinc base with a violet primary. Installs the theme first, then sets its colours and radius; every text pair meets WCAG AA.
Installation
pnpm dlx shadcn@latest add @corsair-ui/theme-violetNo setup needed: the CLI finds @corsair-ui in the shadcn registry directory. The files land in your project as source: edit them like your own code. More in Installation.
- Also adds
- theme
Examples
Light and dark
The preset's variables, applied to a few components.
light
New
Muted text on the background.
dark
New
Muted text on the background.
Styling
Restyle it in your project: className on each part, the theme variables, and these attributes with arbitrary variants.
- It installs the theme first, then sets these colours and the radius. To change a colour afterwards, edit the variable in your global CSS, or build a new set on the Themes page (/themes).
Accessibility
- Every text pair (text, muted text, primary and destructive buttons, cards) reaches WCAG AA, 4.5:1, in light and dark mode.
Compatibility
- Tailwind CSS
- 3.4 and 4, both checked in CI
- React
- 19
- Rendering
- Works in server components