Design system

Colors

• Background

  #090B12

• Secondary

  #10131D

• Card

  #141925

• Border

  #252B3B

• Primary

  #6D4AFF

• Violet (text, lines)

  #9580FF

• Blue

  #4F97FF

• Success

  #3DD68C

• Warning

  #F2B45A

• Destructive

  #E5484D

Typography

Display, Archivo wide

Heading, for section titles

Title, for rows and labels of content

Body text uses Archivo at normal width, with lines kept under 80 characters for comfortable reading.

Small text carries supporting information.

const code = "JetBrains Mono, for real code only";

Spacing, radii and shadow

• 4

• 8

• 12

• 16

• 24

• 32

• 48

• 64

• Small: inner controls
• Medium: buttons, inputs
• Large: panels
• Raised shadow

Buttons and badges

Dropdowns, dialogs and notifications

Cards, empty and loading states