Serafim

Rosé Pine shadcn/ui theme

Explore the Rosé Pine shadcn/ui theme: styles, tokens, and UI previews from the 21st Community.

shadcn/ui theme 76

Open in editor
About

Rosé Pine 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#faf4ed
  • --foreground#575279
  • --primary#575279
  • --primary-foreground#faf4ed
  • --secondary#dfdad9
  • --accent#f2e9e1
  • --muted#f4ede8
  • --muted-foreground#797593
  • --card#fffaf3
  • --border#cecacd
  • --ring#907aa9
  • --destructive#b4637a

dark

  • --background#191724
  • --foreground#e0def4
  • --primary#e0def4
  • --primary-foreground#191724
  • --secondary#403d52
  • --accent#26233a
  • --muted#21202e
  • --muted-foreground#908caa
  • --card#1f1d2e
  • --border#403d52
  • --ring#c4a7e7
  • --destructive#eb6f92

More by Serafim

View all