Themes/Notion
Start building with Notion

Notion Design System

Soft, warm, content-focused. Minimal chrome with excellent readability.

Dashboard

Total Revenue

$15,231.89

+20.1% from last month

Subscriptions

+2,350

+180.1% from last month

Cards

Move Goal

Set your daily activity goal.

350

Calories/day

Exercise Minutes

Your activity trend this week.

Mon
Tue
Wed
Thu
Fri
Sat
Sun

Forms

Create an account

Enter your email to get started.

Email

example@acme.com

Password

••••••••

Notifications

Manage your notification preferences.

Push notifications
Email digest
Marketing emails

Buttons

CSS Variables — shadcn/ui compatible
:root {
  --background: #FFFFFF;
  --foreground: #37352F;
  --card: #FFFFFF;
  --card-foreground: #37352F;
  --primary: #2383E2;
  --primary-foreground: #FFFFFF;
  --secondary: #F1F1EF;
  --secondary-foreground: #37352F;
  --muted: #F7F6F3;
  --muted-foreground: #787774;
  --accent: #F1F1EF;
  --accent-foreground: #37352F;
  --border: #E9E9E7;
  --input: #E9E9E7;
  --ring: #2383E2;
  --radius: 0.25rem;
}

Color Palette

Primary

#2383E2

Primary Foreground

#FFFFFF

Secondary

#F1F1EF

Secondary Foreground

#37352F

Background

#FFFFFF

Foreground

#37352F

Card

#FFFFFF

Card Foreground

#37352F

Border

#E9E9E7

Muted

#F7F6F3

Muted Foreground

#787774

Brown

#64473A

Orange

#D9730D