Shadcn Colors
We use the shadcn/ui color system to ensure consistency, accessibility, and scalability across our UI.
Total Revenue
$15,231.89
+20.1% from last month
Subscriptions
+2350
+180.1% from last month
June 2023
| Su | Mo | Tu | We | Th | Fr | Sa |
|---|---|---|---|---|---|---|
Move Goal
Set your daily activity goal.
350
Calories/day
Exercise Minutes
Your exercise minutes are ahead of where you normally are.
Team Members
Invite your team members to collaborate.
OM
Sofia Davis
m@example.com
JL
Jackson Lee
p@example.com
IN
Isabella Nguyen
i@example.com
Cookie Settings
Manage your cookie settings here.
Payment Method
Add a new payment method to your account.
OM
Sofia Davis
m@example.com
Hi, how can I help you today?
Hey, I'm having trouble with my account.
What seems to be the problem?
I can't log in.
Create an account
Enter your email below to create your account
Or continue with
Report an issue
What area are you having problems with?
June 2023
| Su | Mo | Tu | We | Th | Fr | Sa |
|---|---|---|---|---|---|---|
Move Goal
Set your daily activity goal.
350
Calories/day
Exercise Minutes
Your exercise minutes are ahead of where you normally are.
Payments
Manage your payments.
| Status | Amount | |||
|---|---|---|---|---|
success | ken99@example.com | $316.00 | ||
success | Abe45@example.com | $242.00 | ||
processing | Monserrat44@example.com | $837.00 | ||
failed | carmella@example.com | $721.00 |
0 of 4 row(s) selected.
Share this document
Anyone with the link can view this document.
People with access
OM
Olivia Martin
m@example.com
IN
Isabella Nguyen
b@example.com
SD
Sofia Davis
p@example.com
Report an issue
What area are you having problems with?
Color Palette
Primary Theme Colors
Background
HEX#F6F6F6
RGB245, 245, 245
HSL0, 0%, 96%
OKLCH0.97, 0, 0
Foreground
HEX#171719
RGB245, 245, 245
HSL0, 0%, 96%
OKLCH0.97, 0, 0
Primary
HEX#006494
RGB245, 245, 245
HSL0, 0%, 96%
OKLCH0.97, 0, 0
Primary Foreground
HEX#FFFFFF
RGB245, 245, 245
HSL0, 0%, 96%
OKLCH0.97, 0, 0
Secondary & Accent Colors
Secondary
HEX#F3F3F4
RGB6, 98, 100.1
HSL6, 98, 100
OKLCH485
Secondary Foreground
HEX#171719
RGB6, 98, 100.1
HSL6, 98, 100
OKLCH485
Accent
HEX#F3F3F4
RGB6, 98, 100.1
HSL6, 98, 100
OKLCH485
Accent Foreground
HEX#171719
RGB6, 98, 100.1
HSL6, 98, 100
OKLCH485
UI Component Colors
Card
HEX#FFFFFF
RGB6, 98, 100.1
HSL6, 98, 100
OKLCH485
Muted
HEX#F3F3F4
RGB6, 98, 100.1
HSL6, 98, 100
OKLCH485
Popover
HEX#FFFFFF
RGB6, 98, 100.1
HSL6, 98, 100
OKLCH485
Card Foreground
HEX#0D0D0E
RGB6, 98, 100.1
HSL6, 98, 100
OKLCH485
Muted Foreground
HEX#5B5B5B
RGB6, 98, 100.1
HSL6, 98, 100
OKLCH485
Popover Foreground
HEX#0D0D0E
RGB6, 98, 100.1
HSL6, 98, 100
OKLCH485
Utility & Form Colors
Border
HEX#E0E0E3
RGB6, 98, 100.1
HSL6, 98, 100
OKLCH485
Input
HEX#E0E0E3
RGB6, 98, 100.1
HSL6, 98, 100
OKLCH485
Ring
HEX#0083B6
RGB6, 98, 100.1
HSL6, 98, 100
OKLCH485
Radius
HEX#F6F6F6
RGB6, 98, 100.1
HSL6, 98, 100
OKLCH485
Status & Feedback Colors
Destructive
HEX#E5002C
RGB6, 98, 100.1
HSL6, 98, 100
OKLCH485
Destructive Foreground
HEX#FFF3F6
RGB6, 98, 100.1
HSL6, 98, 100
OKLCH485
Chart & Visualization Colors
Chart 1
HEX#0083B6
RGB6, 98, 100.1
HSL6, 98, 100
OKLCH485
Chart 2
HEX#007A3C
RGB6, 98, 100.1
HSL6, 98, 100
OKLCH485
Chart 3
HEX#E81526
RGB6, 98, 100.1
HSL6, 98, 100
OKLCH485
Chart 4
HEX#FFB636
RGB6, 98, 100.1
HSL6, 98, 100
OKLCH485
Chart 5
HEX#FF8038
RGB6, 98, 100.1
HSL6, 98, 100
OKLCH485
Sidebar & Navigation Colors
Sidebar Background
HEX#EAEAEA
RGB6, 98, 100.1
HSL6, 98, 100
OKLCH485
Sidebar Foreground
HEX#37373D
RGB6, 98, 100.1
HSL6, 98, 100
OKLCH485
Sidebar Primary
HEX#171719
RGB6, 98, 100.1
HSL6, 98, 100
OKLCH485
Sidebar Primary Foreground
HEX#F9F9F9
RGB6, 98, 100.1
HSL6, 98, 100
OKLCH485
Secondary Foreground
HEX#E0E0E3
RGB6, 98, 100.1
HSL6, 98, 100
OKLCH485
Accent
HEX#171719
RGB6, 98, 100.1
HSL6, 98, 100
OKLCH485
Secondary
HEX#E1E4E8
RGB6, 98, 100.1
HSL6, 98, 100
OKLCH485
Secondary Foreground
HEX#1979ED
RGB6, 98, 100.1
HSL6, 98, 100
OKLCH485