Layout & Principles · Layout & Grids
Container
also known as wrapper, content container
A container is an element that wraps content and limits its maximum width, centering it and keeping lines readable on wide screens. It acts as the outer frame that the grid and columns live inside. Containers often have a max-width plus horizontal margins or padding.
See it live — shadcn/ui · MUI · Ant Design
Don't confuse it with
A container is a bounded box that holds content, usually with a max-width; the viewport is the full visible screen the container sits within. The grid is the column structure inside the container.
In the wild
Text sits in a 1200px-wide container centered on the page so lines don't stretch too long on big monitors.