1 slot open this monthBy the makers of shadcnregistryWe built shadcnregistry. Now we build your product.Book a callCheck availability
1 slot open this monthAI features?We build AI features into your product.Book a callCheck availability
1 slot open this month๐Ÿšจ Slop police๐Ÿšจ Slop police: we clean up vibe-coded apps.Report itReport your app
shadcnregistry
shadcnregistry
RegistryHealthInspect
Terms of ServicePrivacy Policy
  1. Registries
  2. paletteui
  3. Ocean

Ocean

theme

Teal and deep sea. Calm depth with bright coral accents.

pnpm dlx shadcn@latest add "https://paletteui.xyz/r/ocean.json"
Premium blocks for shadcn/uiShadcnblocks.com ยท AffiliateExplore

Light Mode

--background:

oklch(0.98 0.004 190)

--foreground:

oklch(0.16 0.02 200)

--card:

oklch(1 0.002 190)

--card-foreground:

oklch(0.16 0.02 200)

--popover:

oklch(1 0.002 190)

--popover-foreground:

oklch(0.16 0.02 200)

--primary:

oklch(0.55 0.14 185)

--primary-foreground:

oklch(0.98 0.004 190)

--secondary:

oklch(0.94 0.01 190)

--secondary-foreground:

oklch(0.28 0.03 200)

--muted:

oklch(0.95 0.008 190)

--muted-foreground:

oklch(0.52 0.02 200)

--accent:

oklch(0.72 0.12 25)

--accent-foreground:

oklch(0.16 0.02 200)

--destructive:

oklch(0.58 0.22 27)

--border:

oklch(0.90 0.008 190)

--input:

oklch(0.90 0.008 190)

--ring:

oklch(0.55 0.14 185)

--chart-1:

oklch(0.55 0.14 185)

--chart-2:

oklch(0.65 0.12 165)

--chart-3:

oklch(0.60 0.14 210)

--chart-4:

oklch(0.72 0.12 25)

--chart-5:

oklch(0.50 0.12 240)

Dark Mode

--background:

oklch(0.12 0.018 200)

--foreground:

oklch(0.92 0.008 190)

--card:

oklch(0.16 0.02 200)

--card-foreground:

oklch(0.92 0.008 190)

--popover:

oklch(0.16 0.02 200)

--popover-foreground:

oklch(0.92 0.008 190)

--primary:

oklch(0.70 0.12 185)

--primary-foreground:

oklch(0.12 0.018 200)

--secondary:

oklch(0.22 0.025 200)

--secondary-foreground:

oklch(0.88 0.008 190)

--muted:

oklch(0.22 0.025 200)

--muted-foreground:

oklch(0.60 0.02 200)

--accent:

oklch(0.65 0.10 25)

--accent-foreground:

oklch(0.12 0.018 200)

--destructive:

oklch(0.70 0.19 22)

--border:

oklch(0.25 0.02 200)

--input:

oklch(0.25 0.02 200)

--ring:

oklch(0.70 0.12 185)

--chart-1:

oklch(0.70 0.12 185)

--chart-2:

oklch(0.68 0.10 165)

--chart-3:

oklch(0.62 0.12 210)

--chart-4:

oklch(0.68 0.10 25)

--chart-5:

oklch(0.56 0.10 240)