DS nav
DS Example FORMS EXPERIMENT TYPE EXPERIMENT COLOR EXPERIMENT Halftone Example Layout Example Grids Example Theming All Images Example Scroll anims Example Colors Links Example Home
Surface & Text Hierarchy
Testing oklch system color manipulation and color-mix layers.
--surface-1
--surface-2
--surface-3
--surface-4
SVG Squiggle filters
1
2
3
4
5
6
Neutral Swatches
neutral-1
neutral-2
neutral-3
neutral-4
neutral-5
neutral-6
neutral-7
neutral-8
neutral-9
neutral-10
neutral-11
neutral-12
Relative Neutral Swatches
rel-neutral-1
rel-neutral-2
rel-neutral-3
rel-neutral-4
rel-neutral-5
rel-neutral-6
rel-neutral-7
rel-neutral-8
rel-neutral-9
rel-neutral-10
Yellow Swatches
yellow-1
yellow-2
yellow-3
yellow-4
yellow-5
yellow-6
yellow-7
yellow-8
yellow-9
yellow-10
yellow-11
yellow-12
Orange Swatches
orange-1
orange-2
orange-3
orange-4
orange-5
orange-6
orange-7
orange-8
orange-9
orange-10
orange-11
orange-12
Blue Swatches
blue-1
blue-2
blue-3
blue-4
blue-5
blue-6
blue-7
blue-8
blue-9
blue-10
blue-11
blue-12
Purple Swatches
purple-1
purple-2
purple-3
purple-4
purple-5
purple-6
purple-7
purple-8
purple-9
purple-10
purple-11
purple-12
Red Swatches
red-1
red-2
red-3
red-4
red-5
red-6
red-7
red-8
red-9
red-10
red-11
red-12
TW Red Swatches
tw-red-1
tw-red-2
tw-red-3
tw-red-4
tw-red-5
tw-red-6
tw-red-7
tw-red-8
tw-red-9
tw-red-10
tw-red-11
tw-red-12
Violet Swatches
violet-1
violet-2
violet-3
violet-4
violet-5
violet-6
violet-7
violet-8
violet-9
violet-10
violet-11
violet-12
Green Swatches
green-1
green-2
green-3
green-4
green-5
green-6
green-7
green-8
green-9
green-10
green-11
green-12
Alpha Variants (Relative Color Syntax)
Text Primary Alphas
a90 - 90% Opacity
a75 - 75% Opacity
a50 - 50% Opacity
a25 - 25% Opacity
Accent & Borders
Accent Color
Subtle Border
Default Border
Strong Border
