Foundation

Accessibility

Reset-level accessibility utilities and interaction constraints.

Accessibility utilities sit below primitives. Components consume them through primitives, not bespoke CSS.
foundation
DOM renderImage render
AccessibilityDefault
Accessibility foundationUtilities / constraints
visually-hiddenvisually-hidden

Utility class for content that should stay available to assistive technology.

.concrete-visually-hidden
focusfocus-target

Shared focus target geometry and ring language consumed by primitives.

.concrete-focus-target
hit-targethit-target

Interactive controls must preserve a scannable touch/click target.

foundation sizing tokens
reduced-motionreduced-motion

Motion tokens and primitives must respect reduced-motion behavior.

prefers-reduced-motion
forced-colorsforced-colors

Color and border choices should remain visible in forced-colors environments.

system color compatible

Playground

Foundation examples are token specimens. The route stays registry-led so every foundation can be rendered, linked, and screenshotted through the same catalog surface.

Loading playground

Rendered matrix

Every state maps to the same foundation render route through the state query param.

Default

Accessibility owns reset-level utilities and constraints below primitives.
Accessibility foundationUtilities / constraints
visually-hiddenvisually-hidden

Utility class for content that should stay available to assistive technology.

.concrete-visually-hidden
focusfocus-target

Shared focus target geometry and ring language consumed by primitives.

.concrete-focus-target
hit-targethit-target

Interactive controls must preserve a scannable touch/click target.

foundation sizing tokens
reduced-motionreduced-motion

Motion tokens and primitives must respect reduced-motion behavior.

prefers-reduced-motion
forced-colorsforced-colors

Color and border choices should remain visible in forced-colors environments.

system color compatible
Render state

Utilities

Utilities are lower than primitives and should be consumed through shared anatomy.
Reset-level utilitiesUtility layer
Visually hidden.concrete-visually-hidden
Focus target.concrete-focus-target
Render state

Public contract

The public prop table is generated from item metadata and schema-backed controls.
NameTypeDefaultDescription