guide

Guide

Surfaces

Read substrate from context; lift relative to it. The library contract is semantic tokens in tokens.css — components do not ship an elevation ladder.

← →

Semantic tokens

Prefer these for chrome and shallow nesting. They flip with theme:

  • --au-surface / --au-surface-muted / --au-surface-hover
  • --au-elevation-composer, --au-elevation-composer-focus, --au-elevation-menu

Optional host elev: deep shells (dialog → menu) may invent a host-owned data-au-elev / --au-elev-* ladder. Keep it out of component CSS. Typical rule: child overlay = parent level + 2.