Premium Docs
Design System Showroom Density normal Platform Flagship
Landing
Playground
Navigator Library map
8 sections 212 routes
Foundations first, then primitives, patterns, structures, and surfaces. Keep this rail legible enough to scan without hunting. Runtime fingerprint Token readout from the active provider chain.
Live DS Runtime
Rottay / Modern Platform Flagship
Primary
#FFFFFF Secondary #A0A0A5
Compact runtime evidence across 3+ token signals.
Layout Layout primitives are the invisible scaffolding that determine balance, spacing, responsiveness, and page-level consistency. Outcome A strong showroom should display layout as composition power, not as blank utility wrappers.
Browse components Open a component to inspect usage guidance, live preview coverage, and engine support without losing the category context.
Primitives Current section
93 Patterns 49 documented routes
Structures 24 documented routes
Surfaces 36 documented routes
Verticals 3 documented routes
Playground 1 documented routes
Developers 2 documented routes
rounded top bar · solid dividers
Layout
Layout Active profile Platform Flagship
Runtime posture Rottay / modern
Primitives contains 15 documented entries. Components
15
Indexed in this category
Runtime
3 engines
Classic, Modern, Rustic
Inspect first
spacing rhythm
Suggested first comparison lens
Where this category earns its keep Use these screens first when you want evidence of hierarchy, responsiveness, and runtime polish.
page shells sections adaptive grids
What to inspect Compare one quality lens at a time so the category does not collapse into generic component browsing.
spacing rhythm
alignment
responsive behavior
Start with these These references are the quickest way to see live DS behavior in this category before you branch into the full index.
Sections align before custom page chrome appears. Spacing and balance should feel deliberate under load. Inspect first spacing rhythm
Engine support Full runtime coverage
Open reference Jump into usage guidance, API surface, and runtime-specific notes.
Generic layout box replacing raw div Sections align before custom page chrome appears. Spacing and balance should feel deliberate under load. Primitive
Collapse 3/3 engines Expandable/collapsible content panel Sections align before custom page chrome appears. Spacing and balance should feel deliberate under load. Primitive
Container 3/3 engines Max-width centered content wrapper Sections align before custom page chrome appears. Spacing and balance should feel deliberate under load. Primitive
Divider 3/3 engines Horizontal or vertical content separator Sections align before custom page chrome appears. Spacing and balance should feel deliberate under load. Flexbox layout container with gap and alignment Sections align before custom page chrome appears. Spacing and balance should feel deliberate under load. CSS grid layout container Sections align before custom page chrome appears. Spacing and balance should feel deliberate under load. Conditionally hide content at breakpoints Sections align before custom page chrome appears. Spacing and balance should feel deliberate under load. Primitive
Layout 3/3 engines Page-level layout with header, sider, content, footer Sections align before custom page chrome appears. Spacing and balance should feel deliberate under load. Primitive
ResponsiveSlot 3/3 engines Slot that renders different content per breakpoint Sections align before custom page chrome appears. Spacing and balance should feel deliberate under load. Primitive
ScrollArea 3/3 engines Custom scrollbar container Sections align before custom page chrome appears. Spacing and balance should feel deliberate under load. Conditionally show content at breakpoints Sections align before custom page chrome appears. Spacing and balance should feel deliberate under load. Primitive
Space 3/3 engines Inline spacing between child elements Sections align before custom page chrome appears. Spacing and balance should feel deliberate under load. Primitive
Splitter 3/3 engines Resizable split pane container Sections align before custom page chrome appears. Spacing and balance should feel deliberate under load. Primitive
Stack 3/3 engines Vertical or horizontal stack with consistent spacing Sections align before custom page chrome appears. Spacing and balance should feel deliberate under load. Box Generic layout box replacing raw div
Collapse Expandable/collapsible content panel
Container Max-width centered content wrapper
Engine support Full runtime coverage
Open reference Jump into usage guidance, API surface, and runtime-specific notes.
Inspect first responsive behavior
Engine support Full runtime coverage
Open reference Jump into usage guidance, API surface, and runtime-specific notes.
Inspect first spacing rhythm
Engine support Full runtime coverage
Open reference Jump into usage guidance, API surface, and runtime-specific notes.
Engine support Full runtime coverage
Open reference Jump into usage guidance, API surface, and runtime-specific notes.
Inspect first responsive behavior
Engine support Full runtime coverage
Open reference Jump into usage guidance, API surface, and runtime-specific notes.
Inspect first spacing rhythm
Engine support Full runtime coverage
Open reference Jump into usage guidance, API surface, and runtime-specific notes.
Engine support Full runtime coverage
Open reference Jump into usage guidance, API surface, and runtime-specific notes.
Inspect first responsive behavior
Engine support Full runtime coverage
Open reference Jump into usage guidance, API surface, and runtime-specific notes.
Inspect first spacing rhythm
Engine support Full runtime coverage
Open reference Jump into usage guidance, API surface, and runtime-specific notes.
Engine support Full runtime coverage
Open reference Jump into usage guidance, API surface, and runtime-specific notes.
Inspect first responsive behavior
Engine support Full runtime coverage
Open reference Jump into usage guidance, API surface, and runtime-specific notes.
Inspect first spacing rhythm
Engine support Full runtime coverage
Open reference Jump into usage guidance, API surface, and runtime-specific notes.
Engine support Full runtime coverage
Open reference Jump into usage guidance, API surface, and runtime-specific notes.
Inspect first responsive behavior
Engine support Full runtime coverage
Open reference Jump into usage guidance, API surface, and runtime-specific notes.