Use a container to build the outer wrapper of a page, constraining content to a comfortable reading width and providing consistent page-level structure.
Figma
The Figma reference for Container will appear here once the design link is added.
Storybook
Interactive examples for Container will render here once the Storybook link is wired in.
Best practices
- Organize a page around a single primary activity.
- Provide breadcrumbs when a page has a parent.
- Give the page a clear, concise title that describes it in as few words as possible.
- Keep the primary action in the page header, with other actions as secondary.
Do’s and don’ts
Do
Title a list page with the pluralized object type: “Orders”.
Don’t
Use long or truncated page titles.