Application standards

Layouts.

Every canvas that isn't the website (the report page, the slide, the social tile, the banner) is set on its own grid: reports and slides on the standard 12 columns with margins and gutters, social formats on a 20-cell pixel grid. On that grid, two rules place everything: choose a grid line, and the logo is sized so its X lands exactly on it; and type never touches that line, starting one clear column past it. The black-on-white skeletons are the core framework; the exemplar covers layer photography and art from the /vi library behind the same grids. The rules page and the pack generator render from the same data module, so this page cannot drift from what the machine produces. Thin red is annotation for the grids and measures, never a brand colour.

The rule
the X sits on a grid line
Report & slide
12 columns · gutters
Social
20-cell pixel grid
Templates
skeleton + flat content
L1

The rule

The grid is the input; the wordmark's anatomy is the converter. The X's optical centre sits at 0.8417 of the logo's width (that is where the X physically is, not a design choice), so choosing a grid line determines the logo's size: flush-left, w = (line − margin) ÷ 0.8417. The line breaks for the wordmark's clear space and runs margin to margin otherwise; when a mirror line answers it, the echo sits at the reflected grid line. Nothing is placed by eye: pick a line and an anchor, and the layout resolves.

The A4 document header on its 12-column grid: the mark is sized so the X lands on the column-4 line; the echo answers at column 8, the mirror position. The measure spans the derivation, 0.8417 × w. Same rule as the website’s central line (W1), fixed to a grid.
L2

The grids

Each document type carries its own grid, and every measure in this chapter lives on it: margins frame the canvas, gutters separate the columns, lines sit in the gutter centres, and the logo's sizes are solved from lines or spanned across whole columns. The source file's by-eye values confirmed the system: A4's measured line positions land on columns 4, 5, 6, and 8 of this grid to within a percent.

FormatCanvasGridMarginGutterHeader row
Report · A41423 × 201412 columns5% · 71px1% · 14px18% H
Slide · 16:93577 × 201212 columns4% · 143px1% · 36px20% H
Social · 1:11080 × 108020 × 20 cells1 cell · 54px20% H
Social · story 9:16proposed1080 × 192020 × 36 cells1 cell · 54px12% H
Banner · 1920×3001920 × 30012 columns2% · 38px1% · 19pxcentred
Email · 1920×750proposed1920 × 75012 columns4% · 77px1% · 19px24% H
Anchors are named, never free: left / right / centred / X-at-centre across; top / header / centre / footer / bottom down. Footers are exact mirrors of headers. Logo sizes exist only as { line: k } (solved onto grid line k) or { span: n } (n whole columns or cells).
L3

Text on the grid

Type never touches the line. A title block starts one clear column past the line (the standoff, measured from the source exemplars) and is capped at a grid line as its measure, so its position and width are grid decisions, not guesses; an eyebrow carries wayfinding above it, a subtitle below, and the engagement meta sits on the footer row. The one exception is dense body text: two reading columns may flank the line at half a gutter each side, the line sitting in the gutter like a column rule. Type is sized as a fraction of the canvas, so it scales with the artifact. A template is a skeleton plus these slots, and its content is flat, serializable data: the exact shape a generated brief fills.

Restoring margin in a slower market

A ninety-day plan to find the cash and hold the line.

Northwind IndustriesJune 2026
The report cover, filled: the mark’s line sits on column 3, the title starts at column 4 (one clear column of air, never on the line) and caps at the echo, column 8, as its measure, locked to the grid. The eyebrow is a practice area (wayfinding, not decoration); the meta is the engagement and the date.
The content contract

Every template accepts the same flat shape, { eyebrow?, title?, subtitle?, meta? }, so a generated brief spreads straight in. No rich text, no nodes: the layout owns the typography, the brief owns the words.

L4

Report · A4

The report runs the standard 12-column document grid. Covers are quiet (a small mark on the column-3 or column-4 line) and scale up through the statement (column 8) to the full-span poster. The document header pairs its line with the echo at column 8; the back cover mirrors the cover at the footer row. Chapter 6:220's move is the strongest: sized from column 6, the X sits on the page's own centre line.

Report · A4 on its grid: 12 columns, 5% margins (red), 1% gutters. The archetype shown is “Document header”.
Document header2:204The working document: the mark on the line at column 4, the mirror line answering at column 8.
Cover mark2:195The quiet report cover: a small mark on the column-3 line, centred row.
X on the page centre6:220Sized from column 6: the X lands on the page's own centre line — the central-line motif at document scale.
Centred mark, twin lines2:356A centred logo solved onto the column-8 line — its echo answers at column 4, so both lines sit on the grid.
Statement2:175The wordmark carries the page, sized from column 8 — the X holds the grid even with no line drawn.
Poster2:254A full 12-column span, margin to margin — the loudest the mark gets.
Back coverproposedThe cover's mirror: the column-3 mark drops to the footer row, the line rising above it.
LetterheadproposedThe horizontal case brought to the document: mark flush-top, the rule running from its shoulder to the margin.
Templates · skeleton + content

Restoring margin in a slower market

A ninety-day plan to find the cash and hold the line.

Northwind IndustriesJune 2026
Report coverproposedThe mark holds the header on the column-3 line; the title starts at column 4 — one clear column off the line — capped at column 8, with the engagement meta on the footer.
02

Where the cash is trapped

Section dividerproposedA large section index over the title, centred on the page — the chapter break inside a report.

The city of tomorrow

Where next for commercial real-estate?

Report cover · photo121:1452The image cover: full-bleed photograph, every ink white. The mark centres on the page, the line breaks for it, and the title hangs off the grid at the top — one clear column off the line.

Margins, missions & medicine

Driving transformation without compromise

Jan 2026
Report cover · lockup121:1370The mark drops to the footer row on the column-5 line; the title owns the top-right of the page, hung one clear column off the line and running to the page edge, with the date on the same column.
March 28, 2027

Margins, missions & medicine

Report cover · half photo121:1394The white upper half carries the type in black ink; the photograph fills the lower half. The mark holds the header on the column-3 line, the title hangs one clear column off it.

Smart Factory

Playbook

Jan 2026
Report cover · poster121:1430The poster cover: a full-bleed photograph, the mark spanning all twelve columns up top, the title below it at the margin, every ink white.
L5

Slide · 16:9

The same 12 columns at presentation margins. Working slides keep the mark small and cornered so the canvas stays free for content; divider and title slides let the line rule the frame. The deck system's five content layouts (title, section break, key points, statement, waterfall) sit on this same grid; these skeletons are the deck's identity moments: the opener, the dividers, the close.

Slide · 16:9 on its grid: 12 columns, 4% margins (red), 1% gutters. The archetype shown is “Corner mark”.
Corner mark2:141The working slide: a four-column mark holds the corner, the canvas stays free for content.
Mark on the line2:1480The divider slide: the column-3 line drops through the X and rules the canvas.
Statement on the line2:1445The title slide: the large mark solved onto the centre column, line through the X.
Full-bleed2:1364Twelve columns, margin to margin — the opening or closing frame.
Closing slide · X at centreproposedThe deck ends where the website begins: a small mark placed so its X sits on the canvas centre.
Footer markproposedThe content slide's signature: the column-3 mark at the flush bottom, line rising.
Templates · skeleton + content

Ninety days to margin

The plan, the proof, and the ask.

Northwind IndustriesConfidential
Title slideproposedThe deck opener: the mark corners the frame, the title fills the left, capped at the column-7 line.
03

The first ninety days

Section breakproposedThe divider slide: a big index and a short title on the line, the canvas otherwise clear.

Project Jupiter

Finance due diligence

July 2026
Pres cover · lockup121:25The side-by-side lockup: the mark sits left of the line, the title block hangs one clear column off it, both rows vertically centred on the frame.

AE Group Efficiency Program

Response document

July 2026
Pres cover · art121:42Full-bleed gradient art: the big mark corners the top-left, the title sits lower-left at the margin, every ink white.

Recovery, not invention.

Draft for discussion
Statement slideproposedOne idea alone at display scale, the mark small at the foot. No exemplar; proposed from the cover grammar with the display-lg step.

We prepare three versions of the same number before every committee.

Group financial controller · European industrial group

Quote slideproposedA fieldwork voice at display-md, attribution beneath, the mark small at the foot. Proposed from the statement grammar.

The taxonomy of complexity

Illustrative
Content slide121:1013The content grammar from Good Chart 01/3 (node 121:1013): title row at display-md top-left, the composition in a full-width region, the mark small at the foot with the caption meta. Measured: title 89px at y140; region clear of the footer row (logo y1830).

The twelve-month recovery

Recovery plan phasing
Chart slide121:1013Good Chart 01's arrangement (node 121:1013): title top-left, the chart owning the right region full-height (x1992→3437 of 3577, grid-snapped to columns 7→12), the mark small at the foot.
L6

Social · 1:1

The social tile runs a 20 × 20 pixel grid: 54px cells, margin of one cell. Lines sit on cell boundaries (6, 7, 8; the echo at 13), spans count whole cells (6, 18). The tile reads at feed size, so there are only three moves: the statement, the mark on the line, and the horizontal lockup.

Social · 1:1 on its grid: 20 × 20 cells, margin one cell (red). The archetype shown is “Statement post”.
Statement post2:1000Eighteen cells across the tile — full content width.
Mark on the line2:1059The workhorse post: the mark sized to cell line 6, header row.
Mark on the line · large2:1107The same layout a step up: the X on cell line 8, centred row.
Two-line grid2:1197The cell-7 line plus its mirror at 13 — the two-column post grid.
Horizontal lockup2:1246The one horizontal case: a six-cell mark, the rule running from its shoulder to the margin.
Templates · skeleton + content

Resilience is a capability, not a cost centre.

Statement postproposedThe tile is the type: a big statement fills the cells, the mark small at the foot.

£14m

Recoverable EBITDA from decisions already made and then left unenforced.

alixpartners.com/working-capital
Stat postproposedThe number is the tile: the statement geometry with the value stepped up and one line of support under it; the link sits at the foot's right, clear of the mark in the left corner.

Margin leaks one discount at a time

The counter gives on price because no one set the floor.

Insight with imageryproposedThe white upper half carries the words beside the mark, the image owns everything below (the A4-168 pattern at feed scale) — type never sits on a photograph in the feed.

How CEOs are rethinking growth in a slower market

Leaders are reallocating capital toward resilience.

alixpartners.com
Post on the lineproposedThe workhorse post: the mark on the cell-6 line up top, a title and a line of support one clear cell off the line below.

Disruption Index

Statement on the line121:1341The mark sits low-left with its line running the full canvas; a short statement hangs one clear cell off the line, centred on it. (Figma's detached year label at the canvas top is dropped — the block model has no slot there, and the statement carries the tile alone.)

Annual B2B growth webinar

Register now on alix.com
Webinar announcement121:1322The wordmark spans eighteen cells up top; the announcement sits in the lower third; the call-to-action is the footer meta.
L7

Social · story 9:16

The story carries the square's 20-cell module onto the tall canvas: same cell size, 36 rows. Every archetype here is proposed: the format doesn't exist in the source file yet, but the grid implies it, and the tall frame is where the line motif works hardest.

Social · story 9:16 on its grid: 20 × 36 cells, margin one cell (red). The archetype shown is “Story · mark on the line”.
Story · mark on the lineproposedThe square post's workhorse carried onto the tall canvas — the line has room to run.
Story · X at centreproposedA six-cell mark on the canvas centre — the tall format's strongest line.
Story · statementproposedEighteen cells at the centre row, nothing else.
L9

Email · 1920×750

The email header exists in the source file but carries no recoverable geometry: one hairline at the foot is the only trace. Both archetypes here are proposed: the document header at email scale, and the footer rule read as the horizontal lockup.

Email · 1920×750 on its grid: 12 columns, 4% margins (red), 1% gutters. The archetype shown is “Email header”.
Email headerproposedThe document header at email scale: mark on the column-4 line.
Email footer ruleproposedThe one recoverable trace in the source file: a rule at the foot — here as the horizontal lockup, mark flush-bottom.
L10

Status & source

The geometry comes from two Figma sources: the VI Overview file (.agents/vi-layout-spec.md holds the raw values and every anomaly) and the Helix Proposal GOOD canvas, whose exemplar covers this page reproduces. Templates carrying their node id are measured from it; the standoff rule is too. Normalisations, and the fact that proposed archetypes and formats await design sign-off, are logged in DESIGN-DECISIONS.md. Imagery ships as webp in public/vi with a searchable index (app/_data/vi-images.ts: alt, tags, tone, provenance), so pack generation can pick a background by topic the same way it fills the text slots: flat data in, the template owns the grid and the type.