⚠️ Mobile is not supported yet.

Bourbon

style

A theme based on the Bourbon color palette

Provided by zippystarter

Open in

Installation

Install directly from the provider.

pnpm dlx shadcn@latest add "https://zippystarter.com/r/bourbon.json"

Files

No files found

Styles

Light Mode

--radius:

1rem

--background:

oklch(0.9800 0.0050 48.9980)

--foreground:

oklch(0.5000 0.0978 48.9980)

--card:

oklch(0.9600 0.0100 48.9980)

--card-foreground:

oklch(0.5000 0.0978 48.9980)

--popover:

oklch(0.9600 0.0100 48.9980)

--popover-foreground:

oklch(0.5000 0.0978 48.9980)

--primary:

oklch(0.5550 0.1630 48.9980)

--primary-foreground:

oklch(0.9800 0.0489 48.9980)

--secondary:

oklch(0.9200 0.0163 48.9980)

--secondary-foreground:

oklch(0.5000 0.0978 48.9980)

--muted:

oklch(0.9200 0.0163 48.9980)

--muted-foreground:

oklch(0.5000 0.0489 48.9980)

--accent:

oklch(0.9200 0.0163 48.9980)

--accent-foreground:

oklch(0.5000 0.0978 48.9980)

--destructive:

oklch(0.5000 0.1500 78.9980)

--destructive-foreground:

oklch(0.0200 0.0978 48.9980)

--border:

oklch(0.9000 0.0098 48.9980)

--input:

oklch(0.9000 0.0098 48.9980)

--ring:

oklch(0.7000 0.0489 48.9980)

--chart-1:

oklch(0.8050 0.0244 48.9980)

--chart-2:

oklch(0.6800 0.0937 48.9980)

--chart-3:

oklch(0.5550 0.1630 48.9980)

--chart-4:

oklch(0.3800 0.2037 48.9980)

--chart-5:

oklch(0.2050 0.2445 48.9980)

--sidebar:

oklch(0.9800 0.0050 48.9980)

--sidebar-foreground:

oklch(0.5000 0.0978 48.9980)

--sidebar-primary:

oklch(0.5550 0.1630 48.9980)

--sidebar-primary-foreground:

oklch(0.0200 0.0978 48.9980)

--sidebar-accent:

oklch(0.9200 0.0163 48.9980)

--sidebar-accent-foreground:

oklch(0.5000 0.0978 48.9980)

--sidebar-border:

oklch(0.9000 0.0098 48.9980)

--sidebar-ring:

oklch(0.7000 0.0489 48.9980)

--header:

oklch(0.9800 0.0050 48.9980)

--header-foreground:

oklch(0.5000 0.0978 48.9980)

--footer:

oklch(0.9800 0.0050 48.9980)

--footer-foreground:

oklch(0.5000 0.0978 48.9980)

--code:

oklch(0.9800 0.0050 48.9980)

--code-foreground:

oklch(0.5000 0.0978 48.9980)

--code-highlight:

oklch(0.7550 0.0100 48.9980)

--code-number:

oklch(0.6550 0.0326 48.9980)

--code-selection:

oklch(0.9600 0.0100 48.9980)

--code-border:

oklch(0.9000 0.0098 48.9980)

Dark Mode

--background:

oklch(0.1800 0.0056 45.9040)

--foreground:

oklch(0.8500 0.0100 45.9040)

--card:

oklch(0.2300 0.0100 45.9040)

--card-foreground:

oklch(0.8500 0.0100 45.9040)

--popover:

oklch(0.2300 0.0100 45.9040)

--popover-foreground:

oklch(0.8500 0.0100 45.9040)

--primary:

Theme

--radius-2xl:

calc(var(--radius) + 8px)

--radius-3xl:

calc(var(--radius) + 12px)

--radius-4xl:

calc(var(--radius) + 16px)

--font-display-family:

var(--display-family)

--font-display-weight:

300

--font-display-tracking:

normal

--font-body-family:

var(--body-family)

--font-body-weight:

300

--font-body-tracking:

normal

--body-family:

var(--font-geist)

CSS

oklch(0.4140 0.1120 45.9040)

--primary-foreground:

oklch(0.9800 0.0336 45.9040)

--secondary:

oklch(0.2800 0.0168 45.9040)

--secondary-foreground:

oklch(0.8500 0.0100 45.9040)

--muted:

oklch(0.2800 0.0168 45.9040)

--muted-foreground:

oklch(0.8500 0.0224 45.9040)

--accent:

oklch(0.2800 0.0168 45.9040)

--accent-foreground:

oklch(0.8500 0.0100 45.9040)

--destructive:

oklch(0.3000 0.1500 75.9040)

--destructive-foreground:

oklch(0.8500 0.0100 45.9040)

--border:

oklch(0.2600 0.0080 45.9040)

--input:

oklch(0.2600 0.0080 45.9040)

--ring:

oklch(0.4640 0.0448 45.9040)

--chart-1:

oklch(0.8915 0.0336 45.9000)

--chart-2:

oklch(0.6660 0.1790 58.3180)

--chart-3:

oklch(0.4140 0.1120 45.9040)

--chart-4:

oklch(0.2820 0.1400 45.9040)

--chart-5:

oklch(0.1845 0.1680 45.9000)

--sidebar:

oklch(0.2300 0.0100 45.9040)

--sidebar-foreground:

oklch(0.8500 0.0100 45.9040)

--sidebar-primary:

oklch(0.4140 0.1120 45.9040)

--sidebar-primary-foreground:

oklch(0.8500 0.0100 45.9040)

--sidebar-accent:

oklch(0.2800 0.0168 45.9040)

--sidebar-accent-foreground:

oklch(0.8500 0.0100 45.9040)

--sidebar-border:

oklch(0.2600 0.0080 45.9040)

--sidebar-ring:

oklch(0.4640 0.0448 45.9040)

--header:

oklch(0.1800 0.0056 45.9040)

--header-foreground:

oklch(0.8500 0.0100 45.9040)

--footer:

oklch(0.1800 0.0056 45.9040)

--footer-foreground:

oklch(0.8500 0.0100 45.9040)

--code:

oklch(0.2300 0.0100 45.9040)

--code-foreground:

oklch(0.8500 0.0100 45.9040)

--code-highlight:

oklch(0.2140 0.0100 45.9040)

--code-number:

oklch(0.3140 0.0168 45.9040)

--code-selection:

oklch(0.1800 0.0056 45.9040)

--code-border:

oklch(0.2600 0.0080 45.9040)

var(--font-merriweather)

--font-mono:

var(--font-geist-mono)