PageShell

Full-page layout shell with header, main, sidebar, and footer slots.

Basic

Header
Main content area — fills remaining vertical space.
Footer

With Sidebar

App
Main content with sidebar layout.

Sub-components

PropTypeDefaultDescription
PageShelldivRoot wrapper. Sets min-h-screen and flex-col for sticky footer.
PageShellHeaderheaderSticky header with backdrop blur and bottom border.
PageShellMainmainFlex-1 main content area that fills available space.
PageShellFooterfooterFooter with top border, pinned to bottom.
PageShellSidebarasideFixed-width sidebar, hidden below md breakpoint.