Theme Builder

Light only

Live theme structure summary.

My Custom Theme

Based on default

Tokens

Colors

Changed

Light modeDual modePreset clean

Apply a derived accent family from a single color.

Current accent

hsl(221 83% 53%)

Search, filter, and edit token groups.

0 changed

Surface#ffffff

Surface Raised#ffffff

Surface Overlay#ffffff

Surface Input#edf0f3

Surface Input Hover#e3e9ed

Surface Inset#000000

Accent

Base

Hover

Active

Subtle

My Custom Theme

default preset

LightDual mode0 changed

DefaultSuccessWarningErrorInfo

Information message

Operation completed

Please review

Something went wrong

Card content with secondary text color. This demonstrates surface, border, and shadow tokens.