Components

Drawer

Bottom sheets: the touch presentation of menus, selects and popovers (decision 4), nested sheets, detents.

Bottom sheet

Full width, top corners 12, surface-popover (#fff | #303030), bottom padding = max(safe area, 8px); enters from 100% + 24px in 300ms on the cds ease-out; the backdrop fades over the same 300ms. Swipe down to dismiss.

Menu rows (default detent)

Tall detent, handle, footer

Nested (covered parent)

Transparent overlay

Light and dark

Static preview of the sheet surface.

light

dark