Mari

lavender blast shadcn/ui theme

Explore the lavender blast shadcn/ui theme: styles, tokens, and UI previews from the 21st Community.

shadcn/ui theme

Open in editor
About

lavender blast re-skins your whole app: colours, radius and type for light and dark mode. Copy it and paste it into your coding agent, or take the tokens below into your globals.css.

light

  • --background#f1ecff
  • --foregroundhsl(224, 71%, 4%)
  • --primary#655496
  • --primary-foregroundhsl(210, 40%, 98%)
  • --secondaryhsl(263, 20%, 94%)
  • --accenthsl(262 80% 96%)
  • --mutedhsl(269 86.2% 93.6%)
  • --muted-foregroundhsl(220 9% 46%)
  • --card#f5f2ff
  • --borderhsl(264 100% 83.9%)
  • --ringhsl(263, 70%, 50%)
  • --destructivehsl(0, 84%, 60%)

dark

  • --backgroundhsl(270 0% 4.6%)
  • --foregroundhsl(210, 40%, 98%)
  • --primary#655496
  • --primary-foregroundhsl(270 0% 100%)
  • --secondaryhsl(263, 40%, 15%)
  • --accenthsl(263 0% 0%)
  • --mutedhsl(263 19.3% 15.6%)
  • --muted-foregroundhsl(260, 10%, 70%)
  • --cardhsl(0 0% 0%)
  • --borderhsl(0 0% 25.4%)
  • --ringhsl(263, 85%, 65%)
  • --destructivehsl(0, 84%, 60%)

More themes

View all