Every Layout Primitive Examples
This page intentionally wires each primitive into live markup so the template has concrete composition patterns.
- Box
- Cover
- Frame
- Grid
- Imposter
- Reel
- Sidebar
- Switcher
Sidebar + Switcher
Grid + Reel
Grid item A
Grid item B
Grid item C
Grid item D
Reel card 1
Reel card 2
Reel card 3
Reel card 4
Cover + Frame + Imposter
Top rail content
Bottom rail content
Layered container
The parent keeps normal document flow while the overlay centers itself in-place.
Useful for dialogs, callouts, and spotlight patterns.
Diagnostics
Existing template test components still render in the same composition flow.