Getting Started

Components

Color Tokens

Explore every color token provided by the Basic UI design system. Each swatch surfaces the raw CSS variable so you can copy the value that best fits your workflow without leaving the page.

Data source: basic.ui.scss

black

12

default

12

blue

24

blue alpha

12

default

12

error

24

default

12

error alpha

12

grey

28

default

12

grey alpha

12

grey alpha b w

1

grey alpha g g

1

w b

1

w w

1

iris

24

default

12

iris alpha

12

primary

24

default

12

primary alpha

12

scales

192

black

12

blue light

12

blue light alpha

12

brand light

12

brand light alpha

12

green light

12

green light alpha

12

grey light

12

grey light alpha

12

iris light

12

iris light alpha

12

orange light

12

orange light alpha

12

red light

12

red light alpha

12

white

12

shadow

5

default

5

success

24

default

12

success alpha

12

warning

24

default

12

warning alpha

12

white

12

default

12