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

Examples

Use fullscreen bursts for major success events, contain celebrations inside focused surfaces, and reset controlled state after every completed launch.

Payment and GST success

Celebrate successful financial workflows with bottom or center-origin bursts.

Success actions (plain CSS)

Contained burst

Set fullscreen to false inside a positioned, clipped ancestor to keep the effect local.

Contained celebration (plain CSS)

Quarterly close complete

The celebration remains clipped to this positioned card.

Controlled reset

Reset active from completed so every later false-to-true transition launches again.

Repeatable celebration (plain CSS)

Completed bursts: 0