Colors

Semantic tokens from the Figma Color collection - dark (default) and light modes.

Background

--bg-base Default surface

--bg-base-2 Raised surface

--bg-base-3 Overlay surface

--bg-neutral Neutral

--bg-neutral-2 Secondary neutral

--bg-brand Brand

--bg-brand-2 Secondary brand

--bg-positive Positive / success

--bg-warning Warning

--bg-danger Danger / error

--bg-disabled Disabled

--text-default Default text

--text-subtle Secondary text

--text-faint Tertiary text

--text-disabled Disabled text

--text-on-brand On brand background

--text-positive Positive

--text-warning Warning

--text-danger Danger

--border-default Default border

--border-subtle Subtle border

--border-strong Strong border

--border-brand Brand border

--border-positive Positive

--border-warning Warning

--border-danger Danger

--border-disabled Disabled

--icon-default Default icon

--icon-subtle Secondary icon

--icon-neutral Neutral icon

--icon-brand Brand icon

--icon-positive Positive

--icon-warning Warning

--icon-danger Danger

Gray

Green

Red

Yellow

Blue

Pink

Slate