Centered Content Shell
A slim top bar and a max-w-3xl reading column on a muted background for docs, articles, or single settings detail pages.
A slim top bar and a max-w-3xl reading column on a muted background for docs, articles, or single settings detail pages.
Search blocks by description or jump to a page.
The source for every Application block is included with Basic and Pro. Pick a plan to copy the code.
Already purchased? Log in
Centered Content Shell is the reading frame, a slim top bar carrying the Acme Docs badge and four nav links (Docs active, Guides, Reference, Help), a muted full-page background, and a max-w-3xl content column. The shipped page is Getting started with Acme: prerequisites card, Step 1 Create a workspace, Step 2 Invite team members, and prev/next page links at the foot.
Nav is one array; the content cards are separate panels rather than one long block. Capping the column at 3xl is the decision that keeps prose from spreading into unreadable line lengths on wide screens.
Reach for this block whenever a page needs sustained reading focus: docs, changelog entries, or a single settings detail form. Wire the nav links to your router and replace the content panels with your own MDX or settings fields.
A natural flow around it on an Application Pro page:
Before
After
One strong use is the docs article frame. Other centered-column pages:
Tip: the top bar hides the icon sidebar on purpose; if you need persistent nav alongside the content column, switch to the sidebar shell.