01

Color

Full technical reference: all system tokens and Tailwind ramps. Click any swatch to copy.

brand

Main brand color, used for primary actions and emphasis

Text on primary backgrounds

Secondary actions and subtle backgrounds

Text on secondary backgrounds

Accent highlights and interactive states

Text on accent backgrounds

semantic

Error states, destructive actions

Success states, confirmations

Warning states, caution indicators

Informational states

surface

Page background

Default text color

Card surfaces

Text on card surfaces

Subdued backgrounds

Secondary text

Popover/dropdown backgrounds

Text in popovers

ui

Default borders and dividers

Input field borders

Focus ring color

Tailwind Color Ramps

Full color scales available via Tailwind utility classes (e.g. bg-blue-500).

zinc

neutral

slate

stone

gray

red

orange

amber

yellow

green

teal

cyan

blue

indigo

violet

purple

pink

rose