Foundations / 05

Grid & spacing

A four-point rhythm, a readable measure and space with a purpose.

Standard · v2.0Updated 04 Sep 2026 Assets & tokens

Layout & spacing

A 4-point base with role-based editorial rhythm.

Product spacing stays compact; brand storytelling expands at major intervals. Every layout resolves to the same grid instead of arbitrary margins.

space.00px

space.14px

space.28px

space.312px

space.416px

space.520px

space.624px

space.832px

space.1040px

space.1248px

space.1664px

space.2080px

space.2496px

space.32128px

space.40160px

Control gap8 / 12

Control inset12 × 16

Card inset24 / 20

Component stack16 / 24 / 32

Content group40 / 48

Section group64 / 80

Chapter128 / 96 / 72

Reading measure62 ch

Primary control48 px mobile

Hit area44 × 44 min

Admin row40 / 44

Market row52 / 64

Radius6 / 10 / 16

Elevation0 / 1 / 2

Card inset16 / 20 / 24

Mobile QA320 / 375 / 390 / 430

12 / 8 / 4Columns by breakpoint

24 / 16 pxColumn gap

1280 pxContent max

62 chReading measure

Desktop≥ 144012 columns80 px page gutter128 px chapter space

Laptop1024–143912 columns48 px page gutter96 px chapter space

Tablet768–10238 columns32 px page gutter96 px chapter space

Mobile≤ 7674 columns20 px page gutter72 px chapter space