Icecream Theme By Shadcndesign.com

theme

pnpm dlx shadcn@latest add "https://shadcndesign-free.vercel.app/r/theme-icecream.json"

Sign In

Icecream Theme By Shadcndesign.com

theme

pnpm dlx shadcn@latest add "https://shadcndesign-free.vercel.app/r/theme-icecream.json"

Light Mode

--background:

oklch(1 0 0)

--foreground:

oklch(0.145 0 0)

--card:

oklch(1 0 0)

--card-foreground:

oklch(0.145 0 0)

--popover:

oklch(1 0 0)

--popover-foreground:

oklch(0.145 0 0)

--primary:

oklch(0.9 0.121 12.737)

--primary-foreground:

oklch(0.05 0.121 12.737)

--secondary:

oklch(0.97 0 0)

--secondary-foreground:

oklch(0.145 0 0)

--muted:

oklch(0.97 0 0)

--muted-foreground:

oklch(0.556 0 0)

--accent:

oklch(0.97 0 0)

--accent-foreground:

oklch(0.145 0 0)

--destructive:

oklch(0.577 0.245 27.325)

--destructive-foreground:

oklch(1 0 0)

--border:

oklch(0.922 0 0)

--input:

oklch(0.922 0 0)

--ring:

oklch(0.9 0.121 12.737)

--chart-1:

oklch(0.9 0.121 125.737)

--chart-2:

oklch(0.7 0.19 48)

--chart-3:

oklch(0.63 0.23 304)

--chart-4:

oklch(0.68 0.15 237)

--chart-5:

oklch(0.66 0.21 354)

--sidebar:

oklch(1 0 0)

--sidebar-foreground:

oklch(0.145 0 0)

--sidebar-primary:

oklch(0.9 0.121 125.737)

--sidebar-primary-foreground:

oklch(1 0 0)

--sidebar-accent:

oklch(0.97 0 0)

--sidebar-accent-foreground:

oklch(0.145 0 0)

--sidebar-border:

oklch(0.922 0 0)

--sidebar-ring:

oklch(0.951 0.121 125.737)

--font-sans:

Instrument Sans, sans-serif

--font-serif:

var(--font-fraunces)

--radius:

0rem

Dark Mode

--background:

oklch(0.22 0.02 12.737)

--foreground:

oklch(1 0 0)

--card:

oklch(0.24 0.02 12.737)

--card-foreground:

oklch(1 0 0)

--popover:

oklch(0.24 0.02 12.737)

--popover-foreground:

oklch(1 0 0)

--primary:

oklch(0.9 0.121 12.737)

Theme

--color-background:

var(--background)

--color-foreground:

var(--foreground)

--color-card:

var(--card)

--color-card-foreground:

var(--card-foreground)

--color-popover:

var(--popover)

--color-popover-foreground:

var(--popover-foreground)

--color-primary:

var(--primary)

--color-primary-foreground:

var(--primary-foreground)

--color-secondary:

var(--secondary)

--color-secondary-foreground:

var(--secondary-foreground)

Light Mode

--background:

oklch(1 0 0)

--foreground:

oklch(0.145 0 0)

--card:

oklch(1 0 0)

--card-foreground:

oklch(0.145 0 0)

--popover:

oklch(1 0 0)

--popover-foreground:

oklch(0.145 0 0)

--primary:

oklch(0.9 0.121 12.737)

--primary-foreground:

oklch(0.05 0.121 12.737)

--secondary:

oklch(0.97 0 0)

--secondary-foreground:

oklch(0.145 0 0)

--muted:

oklch(0.97 0 0)

--muted-foreground:

oklch(0.556 0 0)

--accent:

oklch(0.97 0 0)

--accent-foreground:

oklch(0.145 0 0)

--destructive:

oklch(0.577 0.245 27.325)

--destructive-foreground:

oklch(1 0 0)

--border:

oklch(0.922 0 0)

--input:

oklch(0.922 0 0)

--ring:

oklch(0.9 0.121 12.737)

--chart-1:

oklch(0.9 0.121 125.737)

--chart-2:

oklch(0.7 0.19 48)

--chart-3:

oklch(0.63 0.23 304)

--chart-4:

oklch(0.68 0.15 237)

--chart-5:

oklch(0.66 0.21 354)

--sidebar:

oklch(1 0 0)

--sidebar-foreground:

oklch(0.145 0 0)

--sidebar-primary:

oklch(0.9 0.121 125.737)

--sidebar-primary-foreground:

oklch(1 0 0)

--sidebar-accent:

oklch(0.97 0 0)

--sidebar-accent-foreground:

oklch(0.145 0 0)

--sidebar-border:

oklch(0.922 0 0)

--sidebar-ring:

oklch(0.951 0.121 125.737)

--font-sans:

Instrument Sans, sans-serif

--font-serif:

var(--font-fraunces)

--radius:

0rem

Dark Mode

--background:

oklch(0.22 0.02 12.737)

--foreground:

oklch(1 0 0)

--card:

oklch(0.24 0.02 12.737)

--card-foreground:

oklch(1 0 0)

--popover:

oklch(0.24 0.02 12.737)

--popover-foreground:

oklch(1 0 0)

--primary:

oklch(0.9 0.121 12.737)

Theme

--color-background:

var(--background)

--color-foreground:

var(--foreground)

--color-card:

var(--card)

--color-card-foreground:

var(--card-foreground)

--color-popover:

var(--popover)

--color-popover-foreground:

var(--popover-foreground)

--color-primary:

var(--primary)

--color-primary-foreground:

var(--primary-foreground)

--color-secondary:

var(--secondary)

--color-secondary-foreground:

var(--secondary-foreground)

--primary-foreground:

oklch(0.05 0.121 12.737)

--secondary:

oklch(0.18 0.02 12.737)

--secondary-foreground:

oklch(1 0 0)

--muted:

oklch(0.1 0.02 12.737)

--muted-foreground:

oklch(0.82 0.024 12.737)

--accent:

oklch(0.28 0.02 12.737)

--accent-foreground:

oklch(1 0 0)

--destructive:

oklch(0.577 0.245 27.325)

--destructive-foreground:

oklch(1 0 0)

--border:

oklch(0.35 0.023 12.737)

--input:

oklch(0.35 0.023 12.737)

--ring:

oklch(0.9 0.121 12.737)

--chart-1:

oklch(0.951 0.121 12.737)

--chart-2:

oklch(0.7 0.19 48)

--chart-3:

oklch(0.63 0.23 304)

--chart-4:

oklch(0.68 0.15 237)

--chart-5:

oklch(0.66 0.21 354)

--sidebar:

oklch(0.2 0.02 12.737)

--sidebar-foreground:

oklch(1 0 0)

--sidebar-primary:

oklch(0.951 0.121 12.737)

--sidebar-primary-foreground:

oklch(0.2 0.02 12.737)

--sidebar-accent:

oklch(0.25 0.02 12.737)

--sidebar-accent-foreground:

oklch(1 0 0)

--sidebar-border:

oklch(0.315 0.023 12.737)

--sidebar-ring:

oklch(0.951 0.121 12.737)

--color-muted:

var(--muted)

--color-muted-foreground:

var(--muted-foreground)

--color-accent:

var(--accent)

--color-accent-foreground:

var(--accent-foreground)

--color-destructive:

var(--destructive)

--color-destructive-foreground:

var(--destructive-foreground)

--color-border:

var(--border)

--color-input:

var(--input)

--color-ring:

var(--ring)

--color-chart-1:

var(--chart-1)

--color-chart-2:

var(--chart-2)

--color-chart-3:

var(--chart-3)

--color-chart-4:

var(--chart-4)

--color-chart-5:

var(--chart-5)

--color-sidebar:

var(--sidebar)

--color-sidebar-foreground:

var(--sidebar-foreground)

--color-sidebar-primary:

var(--sidebar-primary)

--color-sidebar-primary-foreground:

var(--sidebar-primary-foreground)

--color-sidebar-accent:

var(--sidebar-accent)

--color-sidebar-accent-foreground:

var(--sidebar-accent-foreground)

--color-sidebar-border:

var(--sidebar-border)

--color-sidebar-ring:

var(--sidebar-ring)

--font-sans:

var(--font-sans)

--font-mono:

var(--font-mono)

--font-serif:

var(--font-serif)

--radius-sm:

calc(var(--radius) - 4px)

--radius-md:

calc(var(--radius) - 2px)

--radius-lg:

var(--radius)

--radius-xl:

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

--shadow-2xs:

var(--shadow-2xs)

--shadow-xs:

var(--shadow-xs)

--shadow-sm:

var(--shadow-sm)

--shadow-md:

var(--shadow-md)

--shadow-lg:

var(--shadow-lg)

--shadow-xl:

var(--shadow-xl)

--shadow-2xl:

var(--shadow-2xl)