1. design
  2. colors

Colors

The Skeleton color system.

Supports

accent, bg, border, caret, decoration, divide, fill, outline, ring, shadow, stroke, text

Palette

Available to all supported properties via .{property}-{color}-{shade}

Primary
50
100
200
300
400
500
600
700
800
900
950
Secondary
50
100
200
300
400
500
600
700
800
900
950
Tertiary
50
100
200
300
400
500
600
700
800
900
950
Success
50
100
200
300
400
500
600
700
800
900
950
Warning
50
100
200
300
400
500
600
700
800
900
950
Error
50
100
200
300
400
500
600
700
800
900
950
Surface
50
100
200
300
400
500
600
700
800
900
950

Pairings

Available to all supported properties via .{property}-{color}-{baseShade}-{darkShade}

500
Default
400
300
200
100
50
600
700
800
900
950
Forward
Default
Backward
50 950
100 900
200 800
300 700
400 600
500
600 400
700 300
800 200
900 100
950 50