Design language

Elevation

Shadow

surface-big--elevation-surface-big0px 0px 0px 1px var(--utility-shadow-stroke), 0px 1px 2px 0px var(--utility-shadow-muted), 0px 2px 4px 0px var(--utility-shadow-muted)
elevation/md--elevation-md0px 0px 0px 1px var(--utility-shadow-stroke), 0px 1px 2px 0px var(--utility-shadow-muted), 0px 2px 4px 0px var(--utility-shadow-muted)
elevation/lg--elevation-lg0px 0px 0px 1px var(--utility-shadow-stroke), 0px 1px 2px 0px var(--utility-shadow-muted), 0px 2px 4px 0px var(--utility-shadow-muted), 0px 0px 4px 0px var(--utility-shadow-subtle)
surface-small--elevation-surface-small0px 0px 0px 1px var(--utility-shadow-stroke), 0px 1px 2px 0px var(--utility-shadow-muted)
controls/glass--elevation-controls-glass0px 0px 0px 1px var(--utility-shadow-stroke-glass), 0px 0px 1px 0px var(--utility-shadow-muted), 0px 1px 2px 0px var(--utility-shadow-subtle)
controls/glass-hover--elevation-controls-glass-hover0px 0px 0px 1px var(--utility-shadow-stroke-glass-hover), 0px 0px 1px 0px var(--utility-shadow-muted), 0px 1px 2px 0px var(--utility-shadow-subtle)
media--shadow-media0px 2px 4px 0px rgb(0 0 0 / 0.12)

Blur

glass--blur-glass6pxCSS backdrop blur for glass buttons, matching the export of Figma's 12px background-blur effect. Other buttons and surfaces on solid grounds do not blur.
panel--blur-panel24pxFrosted panels over imagery.
surface--blur-surface6pxBehind raised surfaces and tertiary buttons, so translucent fills stay clean.