Getting StartedInstallation and setup guides 6
LayoutWorkflow and structural layout components 8
OverlayModal and floating layer surfaces 3
FeedbackStatus, empty, progress, and loading placeholder patterns 5
FormInput and selection components 25
UtilityGeneral-purpose interface utilities 7
NavigationMenu surfaces and hierarchical actions 7
Overview API Styling Examples

Examples

Wrapper dialog examples focused on common confirmation flows. Use the headless dialog page when you need to author the overlay DOM yourself.

Confirmation workflow

Open a dialog, choose an action, and capture the result in local state.

Wrapper destructive confirmation

result: No decision yet

Content slot styling

Target the projected body wrapper with [data-slot="dialog-content"] for spacing, surface, and scroll treatment.

Style dialog body through the content slot

Custom dimensions

Set dialog panel width and height through CSS variables on the wrapper host.

Open a dialog with entered width and height