Themes/Discord
Start building with Discord

Discord Design System

Dark, vibrant, and playful. Blurple accent on deep charcoal. Built for communities.

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: #313338;
  --foreground: #F2F3F5;
  --card: #2B2D31;
  --card-foreground: #F2F3F5;
  --primary: #5865F2;
  --primary-foreground: #FFFFFF;
  --secondary: #4E5058;
  --secondary-foreground: #F2F3F5;
  --muted: #1E1F22;
  --muted-foreground: #B5BAC1;
  --accent: #5865F2;
  --accent-foreground: #FFFFFF;
  --destructive: #ED4245;
  --border: #3F4147;
  --input: #1E1F22;
  --ring: #5865F2;
  --radius: 0.5rem;
}

Color Palette

Primary

#5865F2

Primary Foreground

#FFFFFF

Secondary

#4E5058

Secondary Foreground

#F2F3F5

Background

#313338

Foreground

#F2F3F5

Card

#2B2D31

Card Foreground

#F2F3F5

Border

#3F4147

Muted

#1E1F22

Muted Foreground

#B5BAC1

Destructive

#ED4245

Success

#57F287