lib
Get access
All themes

Harbor

Calm and trustworthy: deep teal on tinted slate, Manrope, generous corners and low, wide shadows.

npx shadcn@latest add @lib/theme-harbor
Customize this theme
Harbor, on real components

Dashboard

Total revenue
$15,231.89
+20.1%
Subscriptions
+2,350
+180.1% from last month
Move goal
Set your daily activity goal.
350calories / day
Exercise minutes
Ahead of where you normally are.

Forms

Upgrade your subscription
You are on the free plan. Upgrade to get every feature.
Create an account
Enter your email below to create your account.
Or continue with

We'll never share it.

Notifications
Choose what reaches you.

Data

Payments
The last four charges.
CustomerStatusAmount
Ad
Ada Parkada@northwind.io
Paid$490.00
Om
Omar Haddadomar@quarry.dev
Paid$2,400.00
Pr
Priya Nairpriya@tessera.co
Failed$490.00
Sa
Sam Okaforsam@atelier.fr
Pending$1,800.00
Team
Invite your team to collaborate.
AdAda Park
OmOmar Haddad
PrPriya Nair

Palette

light
Base
background#f8fafa
foreground#10292b
Surfaces
card#ffffff
card-foreground#10292b
popover#ffffff
popover-foreground#10292b
muted#eef3f3
muted-foreground#5b7274
Brand
primary#0f766e
primary-foreground#ffffff
secondary#e0f2f1
secondary-foreground#0b4f4a
accent#e8f1f1
accent-foreground#10292b
Lines
border#dbe5e5
input#dbe5e5
ring#0f766e
Status
destructive#dc2626
destructive-foreground#ffffff
info#0284c7
info-foreground#ffffff
Charts
chart-1#0f766e
chart-2#0ea5e9
chart-3#f59e0b
chart-4#16a34a
chart-5#94a3b8
Sidebar
sidebar#f1f6f6
sidebar-foreground#10292b
sidebar-primary#0f766e
sidebar-primary-foreground#ffffff
sidebar-accent#e8f1f1
sidebar-accent-foreground#10292b
sidebar-border#dbe5e5
sidebar-ring#0f766e
dark
Base
background#0b1718
foreground#e6f2f2
Surfaces
card#102122
card-foreground#e6f2f2
popover#102122
popover-foreground#e6f2f2
muted#16292b
muted-foreground#8fb0b0
Brand
primary#2dd4bf
primary-foreground#042f2e
secondary#123436
secondary-foreground#ccfbf1
accent#173133
accent-foreground#e6f2f2
Lines
border#ffffff14
input#ffffff14
ring#2dd4bf
Status
destructive#f87171
destructive-foreground#ffffff
info#38bdf8
info-foreground#ffffff
Charts
chart-1#2dd4bf
chart-2#38bdf8
chart-3#fbbf24
chart-4#4ade80
chart-5#64748b
Sidebar
sidebar#0d1c1d
sidebar-foreground#e6f2f2
sidebar-primary#2dd4bf
sidebar-primary-foreground#042f2e
sidebar-accent#173133
sidebar-accent-foreground#e6f2f2
sidebar-border#ffffff14
sidebar-ring#2dd4bf

Typography

Headings ยท ManropeKnow your numbers before anyone asks
Body ยท ManropeEvery block reads the same tokens, so a theme restyles the whole product at once.
Code ยท JetBrains Mononpx shadcn@latest add @lib/theme-harbor
Letter spacing -0.005em

Shape and depth

Radius 0.75rem ยท spacing unit 0.25rem ยท icon weight 1.75

xs
md
xl
2xl