Layout
Margins should be derived from the format, not chosen per document, so one rule covers a poster, a slide and a story. The measured figure is 8%, and everything else on this page follows from it.
One number governs the page. It was measured off the artwork rather than chosen, which is why it lands on 8% and not on a rounder figure.
The 8% margin, measured and then generalised
8% margin. On a 1000px artefact that is 80px, leaving 840px.
What was measured
Every 1000px-wide artefact in the library sits on an 80px margin. That leaves an 840px content column, and the type sizes across the existing work are all set against that column.
The figure is worth stating precisely because it is the one thing a new artefact can get wrong invisibly. A 60px margin is not obviously incorrect on its own, and it is obviously incorrect beside the rest of the set.
How it generalises
Take 8% of the short edge and apply it on all four sides. That single rule reaches every format without anybody picking a number per document.
A4 at 210 by 297mm lands on a 16.8mm margin, leaving a 176.4mm column. A 1920 by 1080 slide lands on 86.4px, and a 1080 by 1920 story lands on the same 86.4px, which is why a story and a slide made from the same content look related.
Deriving from the short edge rather than the width is what keeps the margin from collapsing on a wide format and swallowing a tall one.
Proposed, not measured. The 8% figure is measured on 1000px artefacts; the short-edge generalisation is an extrapolation and has not been tested on a 16:9 slide or in print.
A fixed radius applied across formats is the tell that a template was resized rather than laid out. Scale it, and a poster and a story read as one system.
Corner radius scales with the artefact
Radius runs at roughly 4 to 6% of the short edge. On a 1000px artefact that is 40 to 60px, on a 1080px frame it is 43 to 65px, and on A4 it is 8.4 to 12.6mm.
The band is deliberately a band. Within it the choice is compositional, and outside it the artefact stops matching the set.
The one hard case is the container shape from graphic elements, whose corners are cut rather than rounded. Where that shape is used, this rule does not apply and the path governs.
Wide formats run a strict right-hand alignment axis. It is the cheapest fix available on a layout that feels unresolved and the most visible.
One right edge, held strictly
Every element in a type block shares one right edge: eyebrow, headline, body and any rule beneath them all stop at the same pixel.
A ragged right inside a type block is what makes an otherwise correct composition feel loose. The eye reads the shared edge as intent, and three different edges as three separate decisions.
The axis is strict, meaning it survives a line break. If a headline rewraps and breaks the edge, the headline is rewritten rather than the axis relaxed.
Measured on wide formats only. Portrait artefacts in the existing library are inconsistent here, so the rule is not yet stated for them.
The reflex on a crowded block is to add space. That produces a bigger crowded block, and the fix is almost always subtraction.
One idea per block
If a block feels busy, remove an element before adding space.
One idea per block, and the block is finished when nothing further can be taken out of it. A statement with a caption, a badge and a rule underneath is four ideas competing for one position.
The element you were about to shrink is usually the one to delete. Shrinking is how a composition ends up with a hierarchy of things nobody reads.
Space is the last adjustment, not the first. Applied to a block that is still carrying too much, it enlarges the problem and moves it further apart.
None of these produce a bad artefact on its own. All four produce a set that does not look like a set, which is the more expensive failure.
Four habits that break the set
Margins are derived from the format, never chosen per document.
Do
8% of the short edge, on every format, without a decision being made.
Don't
A 40px margin because it looked right on this one artefact at this one size.
Radius scales with the artefact.
Do
48px on a 1000px post, 12mm on A4, 56px on a 1080px story.
Don't
A 16px radius on everything from a business card to a poster, which reads as a resized screenshot.
One right edge per type block.
Do
Eyebrow, headline and body all stopping on the same axis, with the rule beneath matching it.
Don't
Three lines with three right edges, each within a few pixels of the others.
One idea per block.
Do
A single statement, alone, with the margin around it.
Don't
A statement, a caption, a badge and a rule, spaced further apart to compensate.
Four gaps, and one of them is a contradiction that needs resolving before this section is published.
What this page does not cover
The section summary in the manifest describes a 22px gutter, and nothing on this page measures one. Either the gutter belongs to the website grid rather than to artefacts, or the summary is out of date, and that needs settling in one edit.
The site’s own column and gutter system is separate from artefact margins and is not documented here. Two grids described on one page is how people end up applying the wrong one.
No baseline grid has been established. Vertical rhythm across the existing artefacts is consistent by eye and by nothing else.
Behaviour below roughly 400px wide is unspecified. At that size an 8% margin is 32px, which is defensible, and it has never been checked against a real screen.