Surface · backgrounds & containers

Neutral backgrounds and container fills. surface is the page; the five surface-container tiers build hierarchy and nested containers. Text uses on-surface (primary) and on-surface-variant (secondary).

Surface & on-surface

surface#FDF7FF

on-surface#1D1A24

on-surface-variant#494455

Surface container tiers

container-lowest#FFFFFF

container-low#F8F1FF

container#F2EBF9

container-high#ECE6F3

container-highest#E6E0EE

Surface dim & bright (add-on)

surface-dim#DED7E5

surface-bright#FDF7FF