color-surface

Preset color-surface values and their consumers.

Scope

These values come from the current preset. Project theme declarations can override them. Mode-specific entries are labeled separately.

Surface roles identify page, subdued, raised, floating and inverse backgrounds. Their stored references resolve through the palette.

Values

base

--color-surface-base

Defaultvar(--color-neutral-0)

lightvar(--color-neutral-0)

darkvar(--color-gray-95)

muted

--color-surface-muted

Defaultvar(--color-neutral-5)

lightvar(--color-neutral-5)

darkvar(--color-gray-100)

raised

--color-surface-raised

Defaultvar(--color-white)

lightvar(--color-white)

darkvar(--color-gray-90)

overlay

--color-surface-overlay

Defaultvar(--color-white)

lightvar(--color-white)

darkvar(--color-gray-80)

inverse

--color-surface-inverse

Defaultvar(--color-black)

lightvar(--color-black)

darkvar(--color-white)

Consumers

surface-

Customize

See variables and modes and theme directives. For usage and examples, see Colors.