Visual identity
This page records the visual identity of Landscape: A Fact-Based Picture of Architecture and AI at Work, for Leaders, Architects and Citizens: what it takes from the series landing page at books.geon.se, what it shares unchanged with The Transformed Architecture, what is distinct by design, and the cover specification in full. The book is a companion to the series, from the same author. It must sit on the same shelf as the seven series covers and still be recognisably its own. Every decision taken here on the author's behalf is also listed in HANDOVER.md.
1. Taken from books.geon.se
The series landing page (Geonitab/books, assets/style.css and index.html) is the reference for everything that faces the reader outside the book itself: the website, the landing-page entry and the cover's structural colours.
| Element | As the landing page has it | Used here |
|---|---|---|
| Palette | navy #1b3a7a, deep navy #1f2a3c, blue #3b82f6, green #0c8c62, page background #f6f8fb, text #182033, muted #4f5b71, rule #dfe5ee, link #1d4ed8; a dark scheme (#0f1522 background, #171f31 surface, #e8edf5 text, #a7b2c6 muted, #8fb4ff link) under prefers-color-scheme: dark and [data-theme="dark"] |
the structural colours of the cover (navy ink, series green), the chart palette's series block, the ink and muted ink of every figure |
| Type | Inter 400, 500, 600 and 800 from Google Fonts, system-ui fallback; body 17 px, line height 1.6 | Inter for the cover, every figure and the site |
| Hero | a gradient from navy to deep navy with a blue glow top right and a green glow bottom left; a 6 px bottom rule in a blue-to-green gradient | the cover's left accent bar (navy to green) and the eyebrow's short bar (navy to blue) echo the rule and the glows without copying the dark hero |
| Eyebrows | uppercase, letter-spaced 0.12 to 0.14 em, weight 600, small | the cover eyebrow and every section eyebrow of the landing-page entry |
| Headings | weight 800, letter-spacing -0.015 to -0.02 em, tight line height | the cover title (900, as on every series cover) and the site headings |
| Book cards | cover left (220 px column), green eyebrow "Book N · Year", title, grey subtitle, one paragraph, a "For" line in muted ink, a gradient button "Read online at ...", plain links | the companion entry in docs/LANDING_PAGE_ENTRY.md reuses .book, .book-no, .button and .link unchanged, with the eyebrow "Companion · 2026" |
| Voice | plain, declarative sentences; no superlatives, no exclamation marks | the cover, the entry, the figure annotations and this page |
2. Shared, unchanged, with the series
These are the series' own and this book does not alter them. Changing any of them is a series decision, taken in all repositories together.
- The blue palette for structure.
docs/mermaid-kvadrat-theme.jsonand thekv-*classes (kv-primary#1E3A8A,kv-accent#2563EB,kv-highlight#3B82F6,kv-muted#E0F2FE,kv-pattern#93C5FD,kv-outline) for every process diagram, with the ice background#F8FAFF. - Type. Inter for diagrams, covers and the site; Noto Serif, Noto Sans and Noto Sans Mono in the PDF (
docs/pandoc.yaml); JetBrains Mono for the code art on the cover. - Templates. The Eisvogel template and the book LaTeX templates in
templates/(kvadrat-book-template.latex,common.latex,fonts.latex,font-settings.latex,hypersetup.latex,after-header-includes.latex,eisvogel-*.latex); the MkDocs theme and stylesheets (mkdocs.yml,docs/stylesheets/); the whitepaper and presentation templates (templates/whitepaper-template.html,templates/presentation-template.html) and their design guidelines indocs/. - Figure captions. The caption style and numbering that
scripts/validate_figure_captions.pychecks: a caption under every figure, in British English, that says what the reader is to see. - The Release Information page. Its layout in
docs/pandoc.yaml(include-before): publication details, publisher, copyright and licensing, ISBN and cataloguing, version, technical production. Only the relation line differs: "From the author of The Transformed Architecture; a companion, not a volume". - From the series cover. The A4 geometry (viewBox 794 x 1123, 210 x 297 mm), the 40 px grid with a centre dot, the faint code art in JetBrains Mono quoting one of the book's own artefacts, the typographic hierarchy (eyebrow 13 px bold letter-spaced; title Inter 900 at 78 px with -3 px letter-spacing; subtitle 22 px; keyword line 18 px with "•" separators; author Inter 700 at 20 px; year 28 px at weight 800), the title position (the content group at translate(94,151), the title block at a further 189 px down), the eyebrow at translate(94,110) with its 36 x 4 px bar, the 8 px accent bar at the left edge, and the author-and-year footer at translate(94,934).
3. Distinct by design
The light cover
Each of the seven volumes has a dark cover in its own palette with a line-art motif, a series line and a 150 px watermark of its number. The companion keeps the geometry and turns the page over: a light ground, navy ink, the series green, no series line, no number, and as its motif not line art but data, the book's own one-page landscape in the Contour notation. A reader who knows the series recognises the shelf; a reader who does not sees a book about seeing. The full specification is in section 5.
The chart palette
docs/chart_palette.json is the controlled palette for the notation's fixed dimensions and the book's data charts. It is validated by scripts/validate_palette.py (contrast and colour-vision deficiency) and used identically in every figure. The rule: one colour per usage mode, fixed; one sequential ramp for the autonomy levels; one neutral for people; one for suppliers; one for non-EU jurisdictions; one faint shade for the empty corner; one warning red. Colour never carries a meaning alone: the mode's number accompanies the colour inside or beside the mark.
| Role | Hex | Notes |
|---|---|---|
| Background | #F8FAFF |
the chart and cover ground (the Mermaid theme's background) |
| Ink | #182033 |
text, automatic-evidence baselines, policy-point diamonds |
| Muted ink | #4F5B71 |
axis labels, ticks, subtitles, the "For" line |
| Grid | #DFE5EE |
chart grid lines and rules |
| Series navy | #1B3A7A |
structure; also Mode 4 and Level 4 |
| Series deep navy | #1F2A3C |
dark hero end stop, dark scheme |
| Series blue | #3B82F6 |
structure; also Mode 1 |
| Series green | #0C8C62 |
the keyword line and the year on the cover, buttons, book-card eyebrows |
| Series ice | #E0F2FE |
clusters and muted boxes in process diagrams |
| Mode 0 Ambient AI | #7890B0 |
AI nobody chose |
| Mode 1 Conversational assistants | #3B82F6 |
|
| Mode 2 Embedded workplace assistants | #40A090 |
|
| Mode 3 Agentic work tools | #C88000 |
|
| Mode 4 Built AI applications | #1B3A7A |
|
| Mode 5 Autonomous production agents | #B2367D |
|
| Level 0 Advisory | #DCE6F7 |
autonomy ramp, lightest |
| Level 1 Assisted | #AEC3E8 |
|
| Level 2 Supervised | #7897D3 |
|
| Level 3 Bounded | #4466B4 |
|
| Level 4 Autonomous | #1B3A7A |
autonomy ramp, darkest |
| People | #6B7280 |
the decision seat; the only way people are drawn |
| Supplier | #A3927F |
supplier containers and chips |
| Non-EU jurisdiction | #8C6D4E |
dotted jurisdiction containers |
| Empty corner | #FBE9E7 |
the Level 4 x R4 cell, shaded in every view |
| Warning | #C0392B |
the thin outline of a Level 3 mark without a policy point |
| Evidence, automatic | #182033 |
solid baseline |
| Evidence, attested | #6B7280 |
dashed baseline |
| Categorical order (charts) | #1B3A7A, #3B82F6, #40A090, #C88000, #B2367D, #7890B0 |
for charts that are not about modes |
| Sequential (charts) | #DCE6F7 to #1B3A7A |
the autonomy ramp |
| Diverging (charts) | #B2367D, #D9A3C3, #EEEEF2, #9DBBD8, #1B3A7A |
Figure density and form
The figures follow the Gapminder manner: clear axes with named scales; direct labels on the marks and lines rather than legends wherever direct labelling works; annotations that say what to see ("the empty corner is empty"; "the squares at Level 3 and above are the agents"); one fact per figure; nothing rescaled to fit a comparison. Every landscape view is rendered by scripts/render_landscape.py from a committed model in landscape/models/, and every data chart by scripts/check_charts.py from a committed spec in charts/ and a dataset in data/. No figure of Nordvik Region or Hansa Mutual is placed by hand. Mermaid is retained for process diagrams only (the secondary form), in the series' blue palette.
Naming
The palette's file and class names keep kvadrat, kv-* and KvadratBlue (docs/mermaid-kvadrat-theme.json, templates/kvadrat-book-template.latex, the :::kv-* classes) for compatibility with the series' engine, which every repository shares. The prose of this book and of this page calls it the series palette. The names are not changed here; renaming them is a series decision.
4. The cover decision
Decision for the author. The cover is the light cover, templates/book-cover.svg. A dark alternative on the series' shared dark layout, templates/book-cover-dark-alternative.svg, is kept so that the author may choose it instead; it is rendered at assets/cover-dark-alternative-600x849.png. Both carry the same content, the same eyebrow and the same motif.
The case for light: the seven covers are dark, and a dark cover in one more palette would read as one more numbered volume, which the book is not; a light cover in the series' own structural colours reads as the same author, a different kind of book; the book's subject is seeing clearly, and a chart ground with a data motif says so; and the one-page landscape is legible in its true colours only on a light ground, because the mode colours are specified for #F8FAFF.
The case for dark: the shelf is uniform; a bookshop or a thumbnail row recognises the family at once; the author may prefer one layout for everything that carries the name.
The dark alternative's palette is slate blue and copper (background #34506E to #0F1826, accent #F0B27A to #D9905A). It is used by no volume: not petrol and amber (AI Governance), indigo and cyan (AI Platform and Security), crimson and coral (AI Red Team), graphite and amber (AI Threat), forest and lime (The Transformed Security Architect), aubergine and pink (AI Boss), nor the blue and green of Architecture as Code. Moss green and sand was considered and set aside because moss sits too close to the forest green of The Transformed Security Architect on a thumbnail row.
Title colour. Two renderings of the title were tried at 600 px wide: solid navy, and a left-to-right gradient built from the six mode colours (Mode 0 to Mode 5 in order). Solid navy was chosen. The gradient reads as a rainbow across nine letters, the grey of Mode 0 weakens the first letter and the amber of Mode 3 loses contrast against the ice ground, and the mode colours carry a meaning in every figure of the book that a decorative use on the title would blur. The mode colours appear on the cover where they mean something: in the marks of the motif. The gradient definition (modeGradient) is kept in the SVG's defs, unused, so that the author can try it by changing one fill.
5. The cover specification
File: templates/book-cover.svg. Renders: assets/cover-600x849.png (600 x 849 px, the landing page), docs/images/book-cover.png (2480 x 3508 px, A4 at 300 dpi, the PDF's first page by docs/pandoc.yaml, re-rendered by docs/build_book.sh from the SVG where librsvg is available). The motif is computed from landscape/models/nordvik_region.yaml at 2027-01-01; when the model changes, the motif is regenerated, not redrawn.
| Element | Specification |
|---|---|
| Canvas | viewBox="0 0 794 1123", 210 x 297 mm |
| Ground | #F8FAFF (the chart background) |
| Grid | the series' 40 px pattern: a 1 px line in navy #1B3A7A at opacity 0.06 and a centre dot of radius 1 at opacity 0.08 |
| Code art | JetBrains Mono, 7 px at line step 11 (bottom left, x 60, from y 790) and 6.5 px at step 10 (right, x 520, from y 880), navy at opacity 0.10; the text is the landscape model: organisation: id: nordvik, units: - id: NR-BT ... mode: 4 identity: own level: 0 reversibility: R3 reach: XL policy_point: enforced decision_tier: T2 evidence: automatic, and the NR-CS fragment |
| Accent bar | rect x=0 y=0 width=8 height=1123, vertical gradient navy #1B3A7A to green #0C8C62 |
| Eyebrow | at translate(94,110): a 36 x 4 px bar (rx 2) in a horizontal gradient navy to blue #3B82F6; text at x 48, Inter 700, 12 px, letter-spacing 2.4 px, navy: FROM THE AUTHOR OF THE TRANSFORMED ARCHITECTURE (12 px rather than the series' 13 px so that the longer line clears the motif) |
| Series line | none |
| Watermark | none |
| Title | inside translate(94,151) then translate(0,189): "Landscape" on one line, baseline y 78, Inter 900, 78 px, letter-spacing -3 px, solid navy #1B3A7A; no text shadow on the light ground; the second line of the series' two-line slot is left empty |
| Subtitle | translate(0,299) inside the content group: Inter 400, 22 px, muted ink #4F5B71, two lines at y 26 and y 59: "A Fact-Based Picture of Architecture and AI at Work," / "for Leaders, Architects and Citizens" |
| Keyword line | the same text element, y 98, Inter 500, 18 px, series green #0C8C62: Autonomy • Reversibility • Reach • Mode • Identity • Control • Evidence (the notation's seven dimensions, in the order of docs/NOTATION.md) |
| Motif | at translate(494,126): the one-page landscape (V1) of Nordvik Region at 2027-01-01. A 5 x 4 grid, cells 56 x 54 px (280 x 216 px), columns Level 0 to Level 4 left to right, rows R4 at the top to R1 at the bottom; grid lines 1 px navy at opacity 0.18; the Level 4 x R4 cell filled #FBE9E7; ticks "L0" to "L4" under the columns and "R4" to "R1" left of the rows in Inter 500, 10 px, muted ink; no other labels. Each unit with status active, pilot or paused on that date is one mark (eleven marks: NR-BT, NR-SA, NR-CS, NR-CR, NR-CN, NR-SW, NR-TL, NR-AMB, NR-EWA, NR-CA, NR-AWT; NR-SOC and NR-EXP are still planned and absent): a circle for identity person, a rounded square (side 1.84 r, rx 0.3 r) for identity own; radius by reach S 7, M 11.2, L 16.8, XL 23.8 px (1 : 1.6 : 2.4 : 3.4); fill by mode colour from docs/chart_palette.json; a 1.5 px white stroke; a diamond of half-diagonal 3.6 px on the left edge, filled ink for an enforced policy point, white with an ink outline for a planned one, absent for none; a grey #6B7280 seat of radius 3 at 6 px above the mark for a decision tier other than T0; a baseline of half-width max(6, 0.8 r) at 5 px under the mark, 1.6 px ink, solid for automatic evidence, dashed (3 2.5) for attested, absent for none. Marks that share a cell are offset by a few pixels so that each stays visible; the offsets are recorded in the generator |
| Author | translate(0,783) inside the content group: Inter 700, 20 px, navy, baseline y 20: Gunnar Nordqvist |
| Year | the same group, x 450 anchored end, Inter 800, 28 px, series green, baseline y 28: 2026 |
| Metadata | <metadata> with title, description, author, <relation>From the author of The Transformed Architecture; a companion, not a volume</relation> and the update month |
The dark alternative differs only in: the series' primary gradient (slate blue #34506E to #0F1826) with the three accent glows; a white grid at the series' opacities; white code art at 0.08 and 0.07; the eyebrow text in white at 85 per cent with the accent-gradient bar; the title in white with the series' text shadow; the subtitle in white at 92 per cent; the keyword line in the accent copper #F0B27A; the motif with every mark in copper, a dark #0F1826 stroke, white seats and baselines, and the empty corner in copper at 10 per cent; the author in white and the year in the accent gradient.
6. Rendering
The PNGs were rendered with Chromium through Playwright (viewport 794 x 1123, oversampled, then resized with Pillow to the exact pixel sizes) because ImageMagick on the build host does not rasterise SVG. docs/build_book.sh re-renders docs/images/book-cover.png with rsvg-convert -w 2480 -h 3508 where librsvg is present; the SVG uses only features librsvg supports (linear and radial gradients, patterns, rgba() colours, feDropShadow on the dark alternative). Inter and JetBrains Mono must be installed on the rendering host; the SVG falls back to sans-serif and Courier New.