pristine

Lens · Fix the structure

layout

Put things in the order the eye should read them.

What is this screen, what matters most, what belongs together: layout answers those before a word is read. Spacing tighter inside a group than between groups does most of the work.

When to use it

It raises
Layout & spacing, Hierarchy & clarity
Skip it when
Structure is fine and only type or color is weak. Breaks on one viewport only (use adapt).

Try it

/pristine polish layout the settings page

Best on long pages, dashboards and settings.

What it changes

Typical before and after values for layout
BeforeAfter
24px gap everywhere, 14 settings in one columnFour named groups, 12px inside a group and 48px between
Primary chart in the third rowPrimary chart first and full width, details below

Laws it applies

Used in these examples