Centered Column

You might say

Keep the content in a narrow column with space on both sides instead of stretching it across the whole screen, like a blog.

Keep one narrow content column centered on the pageA centered column focuses attention on reading or one simple task such as signing in, composing a post, or changing settings. Set a comfortable maximum width and keep supporting actions nearby. It is not suitable for dense dashboards that need side-by-side comparison.

Content columncentered and limited to 600~720px

When to use it

Article or essay
Sign-in and account setup
Focused form
oil-oil••••••••
Sign in
Simple settings or editor

When NOT to use it

Place wide tables in a narrow column
Center-align long body paragraphs
Let the column grow too wide on large screens
Use excessive empty margins when more context is needed

Anatomy

Leave blank space on both sides to help focus attention on the middle

Centered width limit 600~720px, 60~75 characters per line

Article, form, or a login card

Variants

Reading

Long text reading, 60~75 characters per line

Auth Card

Form

Settings page, single column form

Typical use cases

Article

Why did I move my blog to a static site

Ali · 3 days ago · Read in 6 minutes

Forgot your password?

Create post

Personal information

Nickname

Weekly featured emails

Profile settings

✓

Subscription successful!

Front-end Weekly is delivered to you@example.com on time at 8 a.m. every Friday