Composition foundation
Сетка и ритм
Горизонтальная сетка, вертикальный ритм, ширина чтения и правила плотности для секций и страниц.
Grid
12 / 8 / 4 колонки
Desktop использует 12 колонок, tablet — 8, mobile — 4. Контент не обязан занимать всю доступную ширину.
Desktop · 12max 1440 / gutter 24–32
Tablet · 8gutter 20–24
Mobile · 4gutter 16
Composition widths
Не одна ширина для всех задач
Vertical rhythm
Секции образуют предсказуемый ритм
Плотность определяется ролью блока, а не случайным количеством padding.
32
48
64
96
128
Patterns
Четыре базовые раскладки
CenteredIntro, final CTA
SplitHero, service, profile
AsymmetricProof, media, editorial
EditorialLong content + aside