Overlays
Drawers
Slide-over panels for forms, profiles, and detail views — anchored to the edge of the viewport above the current page.
Looking for the interactive Sheet primitive and every prop? See Components › Overlays.
With close button on outside
Dismiss control floats on the scrim just outside the panel edge.
Empty
A bare narrow panel with a titled header and dismiss button.
Wide empty
The empty panel at a wider max-width for denser content.
With background overlay
A dimmed, blurred scrim focuses attention on the panel.
With branded header
A saturated brand header with title and supporting copy.
With sticky footer
Scrollable body with action buttons pinned to a sticky footer.
Create project form
Branded header, stacked form fields, and a sticky action footer.
Wide create project form
A two-column, label-aligned form for roomier data entry.
User profile
Cover image, avatar, quick actions, and a profile detail list.
Wide horizontal user profile
A horizontal profile layout with identity column and detail grid.
Contact list
Searchable directory with sticky alphabetical section headers.
File details
File preview, metadata, sharing list, and download actions.