Skip to main content

Search rules

Search all UI Guides rules by name, category, or source

layoutimpeccable

Same Padding Everywhere Is Monotony

SHOULD

SHOULD: Vary spacing to encode grouping: ~8-12px BETWEEN siblings, ~48-96px BETWEEN sections. Uniform padding everywhere does not just look boring, it does not parse — when a label sits as far from its input as from the next section, nothing groups and every element floats at equal weight. The detector rounds every padding/margin/gap to 4px and, given >=10 samples, fires when ONE value exceeds 60% of them AND there are <=3 unique values. The opposite ditch is `design-rams-inconsistent-spacing` (arbitrary, unrepeatable values); the target is a small scale, applied to mean something.

Vary spacing for rhythm — tight inside a group, generous between sections, because spacing is what encodes grouping

Bad

Good

Why it matters

The detector is precise about what "everywhere" means: it collects every padding, margin, and gap value on the page, rounds each to the nearest 4px, and — once it has at least 10 of them — flags the page when ONE value accounts for more than 60% of the total AND there are 3 or fewer unique values. A page where every gap is 16px scores 100% dominance across a single unique value.

The failure is not that it looks boring, it is that it does not parse. Spacing is the primary encoder of grouping: when a label sits as far from its own input as it does from the next section, nothing groups, and every element floats at equal weight. impeccable gives the rhythm as ranges — tight groupings of 8-12px BETWEEN siblings, generous separations of 48-96px BETWEEN distinct sections — so that proximity alone makes the structure legible, without a single border or divider doing the work.

Note that `design-rams-inconsistent-spacing` is the opposite ditch: that one fires when spacing is arbitrary and unrepeatable, this one when it is uniform and meaningless. The target is neither — a small scale, applied to mean something.

Built by Gleb Stroganov, design engineer at Evil Martians.

The rules come from other people's skills and guidelines — Vercel, Rauno Freiberg, @Ibelick, impeccable, Emil Kowalski, Tailwind, RAMS — each one credited on the Sources page. The work here is extraction and wiring: every rule is pulled into one corpus, given a good and a bad example you can operate, a MUST/SHOULD/NEVER rule an agent can paste, and a link back to where it came from.