Web Components · Playgrounds
Playgrounds
Interactive demos for each custom element. Open a component, edit the HTML markup, then click Apply (or press Cmd/Ctrl+Enter) to refresh the live preview.
Feedback
Status messages, alerts, and confirmation screens
Layout
Headers, section shells, and confirmation blocks
-
Info Screen Header
Info screen header with blue background and decorative stripes
-
Section Block
Section block component with header, description and slotted children
-
Confirm Section
Confirm section component with title, description and confirm button
-
Edit Card Info
Edit card info component with name, role and edit button
Overlays
Modals and layered dialogs
Media
Carousels and embedded video
Marketing
Banners, promo blocks, and consent surfaces
Controls
Interactive utilities and demo components