Theemes
Saturation0
Contrast0
Roundness0.5rem

Preview

myapp.com
Acme Inc
New

Build faster

The modern toolkit for creating applications.

Analytics
Track metrics
Team
Collaborate
AB

Theme

Paste into v0, Cursor, or Claude

Apply this shadcn/ui theme to my project.

Theme: "My Theme"
Mode: light

CSS Variables (add to globals.css :root):
--background: 220 7% 98%;
--foreground: 220 35% 10%;
--primary: 220 70% 45%;
--primary-foreground: 220 14% 98%;
--secondary: 220 11% 94%;
--muted: 220 7% 95%;
--border: 220 11% 90%;
--radius: 0.5rem;

Hex values for reference:
Background: #fafafa
Foreground: #111722
Primary: #2258c3
Primary FG: #f9fafb
Secondary: #eeeff1
Muted: #f1f2f3
Border: #e3e5e8

Font: Inter
Radius: 0.5rem

Also set these derived variables:
--card: var(--background);
--card-foreground: var(--foreground);
--popover: var(--background);
--popover-foreground: var(--foreground);
--secondary-foreground: var(--foreground);
--muted-foreground: var(--foreground);
--accent: var(--secondary);
--accent-foreground: var(--foreground);
--input: var(--border);
--ring: var(--primary);