V2 — Typography System

Typography

Two registers: UI and Comms, Socarrat and Albufera. Manrope for the product interface. The marketing tríada (Instrument Serif, Schibsted Grotesk, and Iosevka Charon) for all external materials.

Rationale

Two registers, one system

The product UI register runs on Manrope alone — a geometric sans-serif already embedded in Socarrat, operating at 14px because Latency's interfaces are information-dense and every pixel of padding recovered from type size is a pixel available for data.

"The marketing register is a high-contrast formal tríada: Instrument Serif at display scale, Schibsted Grotesk as the body anchor, and Iosevka Charon as the monospace voice for data and code contexts. The combination is deliberate provocation."
V2 — Rationale

Context split

The product dashboard uses Air (#FFFFFF), not Parchment. High-density data interfaces require the fastest possible scan. The warm earth palette is calibrated for reading pace, which is a feature in marketing and a friction in a dashboard. The two systems serve two cognitive modes and must not bleed into each other.

Density rule

The Instrument Serif / Schibsted pairing only works at low information density. The sophistication of the marketing register lives in scale and whitespace. Compress either and the aesthetic collapses into visual noise. A landing page section with a 64px headline, three sentences of body copy, and a Grape CTA reads as premium. The same section with five content blocks does not.

A — Product UI typography · Socarrat

Manrope

Manrope; Socarrat system. Applies to the product platform interface only. A geometric sans-serif optimised for information density.

Manrope; Product UI Socarrat · Google Fonts · OFL

Manrope

The platform uses Schibsted Grotesk in this brand book (both share geometric DNA). Manrope is the production typeface in the Socarrat component library.

ABCDEFGHIJKLMNOPQRSTUVWXYZ · abcdefghijklmnopqrstuvwxyz · 0123456789


Product type scale

Platform standard: 14px (Body S) as the base body size. This is a deliberate exception to the WCAG 16px guideline; accepted because Latency's interfaces are information-dense financial data dashboards. Midnight on Air achieves 18.58:1 — AAA PASS — well above AA at 14px.

ui.display 32px · Bold · 44px lh Display
ui.title-m 24px · Bold · 32px lh Title M
ui.title-s 20px · Bold · 28px lh Title S
ui.body-s 14px · Regular · 20px lh Body S; platform standard. Information-dense data interfaces.
ui.caption 12px · Regular · 16px lh Caption; metadata and labels
ui.tiny 11px · Regular · 16px lh Tiny; overlines, status chips, minimal labels

Deprecated: Body M (16px Regular) is no longer used anywhere in the platform. Do not reintroduce it.

B — Marketing typography · Albufera

The tríada

Instrument Serif + Schibsted Grotesk + Iosevka Charon. For all external marketing materials. The combination is not safe; it requires precise size relationships and spacing to function as a craft decision rather than a typographic error.

Instrument Serif — Display & headlines Google Fonts · OFL · Regular (400) only

The definitive intelligence layer for European private markets.

Aa Bb Cc Dd Ee Ff Gg

Italic variant; for editorial emphasis

Minimum size

48px. Never below. At 24px the condensed proportions disappear and it reads as Times New Roman with a failed web font load.

Letter-spacing

0 to -0.02em only. Never positive tracking. Opening the spacing makes the headline look like a typeface mistake.

Colour

Midnight (#1A181E) or Air (#FFFFFF) only. For tonal variation: Grape (#4E00EB). Semantic colours are off-limits for any heading.

Schibsted Grotesk — Body & supporting text Google Fonts · OFL · 400, 500, 600, 700

The European private markets data infrastructure problem isn't about effort. It's about architecture. Three platforms running in parallel, financial data arriving 18 months late, and the most interesting companies staying effectively invisible; that's not a research failure. It's a process failure.

Schibsted Grotesk Bold — h3 and h4 level

OVERLINE — 11PX 600 UPPERCASE

Pairing principle

Schibsted's circular 'o' and 'a' produce open, readable body text that contrasts deliberately with Instrument's compressed, sharp editorial character. This combination requires precise size relationships; if the hierarchy breaks down, the page reads as a typographic error.

Letter-spacing

-0.01em for body and heading sizes. 0.08em for overlines (uppercase only). Never positive tracking on body text.

Iosevka Charon — Monospace Self-hosted · OFL · github.com/be5invis/Iosevka

Revenue: €12,400,000
EBITDA margin: 18.4%
3-year CAGR: 14.2%
Ownership: Holding entity → OpCo
Registry: Registro Mercantil 2023

Source-level · Traceable · Normalised

Variant

Iosevka Charon specifically; for serifed 1 and slashed 0. Do not substitute with plain Iosevka. JetBrains Mono is the brand book fallback (used on this site).

Minimum weight

Medium (500) on warm backgrounds. At Regular (400) and 14px on Parchment, hairline strokes can lose perceived definition due to subpixel rendering.

Cell padding

Minimum 16px horizontal cell padding in all table cells containing Iosevka. Add 4px extra vertical padding (24px total). The whitespace makes the data legible.

Marketing type scale

The full scale

Two-column scale: Instrument Serif for headline tokens, Schibsted Grotesk for body tokens. Scale adjacency check: every adjacent step is at least 2px apart.

Instrument Serif — headline tokens

mkt.display 80px · 400 · 1.05lh Display
mkt.h1 64px · 400 · 1.1lh Heading 1
mkt.h2 48px · 400 · 1.15lh Heading 2

Schibsted Grotesk — body tokens

mkt.h3 28px · 700 · 1.2lh Heading 3 — Schibsted Bold
mkt.h4 22px · 700 · 1.25lh Heading 4
mkt.body-lg 18px · 400 · 1.6lh Body large — primary body copy for marketing pages
mkt.body-md 16px · 400 · 1.55lh Body medium — secondary body copy
mkt.body-sm 14px · 400 · 1.5lh Body small — captions, footnotes, supporting detail
mkt.overline 11px · 600 · uppercase · 0.08em ls SECTION LABEL
mkt.code 14px · 500 · mono · 1.6lh €12,400,000 · 18.4% · 14.2% CAGR

Combination rules

How the three typefaces work together

These rules encode the design guidance provided in the brief. They are system constraints, not stylistic preferences.

Instrument Serif is the typographic event

A headline at 64px or 80px that interrupts the Schibsted body is correct. A subheading at 28px is not. Instrument Serif at subheading scale reads as a rendering problem, not a craft decision.

Schibsted carries the reading weight

All body copy, supporting text, h3, h4, overlines, labels, captions. Schibsted does the work of communication; Instrument does the work of stopping the reader.

Iosevka is the data voice

Financial figures, code snippets, registry data, technical specifications. Iosevka in Amber on Deep Royal or Obsidian on Bone. Always Medium (500) or heavier on warm backgrounds.

Never mix registers

Manrope belongs to Socarrat. Schibsted Grotesk is the Albufera body typeface. They serve different cognitive modes. A marketing PDF using Manrope reads like a product screenshot at page scale.

Scale adjacency

Every adjacent step in the marketing scale is at least 2px apart. mkt.display (80px) to mkt.h1 (64px): 16px gap. mkt.h2 (48px) to mkt.h3 (28px): 20px gap. This is optical balance, not mathematical ratio.

Whitespace is the mechanism

The warm palette and the tríada carry their meaning through whitespace. Remove the whitespace and the palette reads as beige clutter, not editorial craft. A marketing page with 40 data points on Parchment doesn't look premium regardless of typeface choices.

Misuse guide

Six forbidden treatments

Three on typographic hierarchy, three on type-on-colour.

1
Instrument Serif as a subheading (below 48px)

Do not

A "Features" section uses Instrument Serif at 24px Bold for the subsection titles. At 24px the condensed letterforms compress against the Schibsted body copy and look narrow, fragile, and unrelated to the headline above. The intended editorial contrast becomes a rendering problem.

Correct use

Instrument Serif below 48px is always wrong. Switch to Schibsted Grotesk Bold at 28px (mkt.h3) for any subsection heading. For H1 contexts, 64px is the floor.

2
Open letter-spacing on Instrument Serif

Do not

A marketing designer applies letter-spacing: 0.05em to a 48px Instrument Serif headline to "open it up." The condensed proportions of Instrument Serif are designed to work at tight or zero tracking. Opening the spacing makes the headline look like a typeface mistake.

Correct use

letter-spacing: 0 to -0.02em on all Instrument Serif copy. Never positive tracking on this typeface under any circumstances.

3
Iosevka without cell padding in financial tables

Do not

A case study shows a comparison table of company financials in Iosevka Charon at 14px with standard 8px cell padding. The narrow monospace characters pack together, and the table looks like a data dump rather than an analytical insight. Revenue figures like 12,400,000 become hard to parse across columns.

Correct use

Minimum 16px horizontal cell padding on all table cells containing Iosevka. Add 4px extra vertical padding (24px total). The whitespace is not wasted; it is what makes the data legible.

4
Steel text on Cloud in marketing tables

Do not

A data table uses Steel (#687692) as the secondary data text colour on Cloud (#F0F2F4) row backgrounds. The ratio is 4.07:1; PASS for large text only. At mkt.body-sm size (14px), the text becomes unreadable on mobile screens.

Correct use

Use Lead (#465063) for secondary text in tables on Cloud backgrounds: 7.23:1; AAA PASS. Reserve Steel for decorative labels and non-essential metadata only.

5
Semantic colour as Instrument Serif headline tint

Do not

A "success story" page section uses Neon (#16CA7F) as the colour for an Instrument Serif 64px headline. The green looks energetic but is not a brand colour; it belongs to the success semantic layer. Readers trained on the system will read "success state" not "headline."

Correct use

Instrument Serif headlines in Midnight (#1A181E) or Air (#FFFFFF) only. For tonal variation, use Grape (#4E00EB). Semantic colours are off-limits for any heading or decorative typographic use.

6
Socarrat typeface (Manrope) in Albufera materials

Do not

A marketing PDF uses Manrope (Socarrat) as the body typeface because the designer recognises it from the product. The document reads like a product screenshot at page scale; the geometric precision that serves Socarrat's dense data interfaces reads as mechanical in a long-form analytical piece.

Correct use

Manrope belongs to Socarrat. Schibsted Grotesk is the Albufera body typeface. They serve different cognitive modes and must not appear in each other's contexts.

Design tokens

W3C font token format

Two sections: Product UI tokens for Manrope, Marketing tokens for the tríada. Both follow W3C format with kebab-case keys.

JSON — W3C Design Tokens
{
  "font": {
    "family": {
      "ui-base":     { "$value": "'Manrope', 'Noto Sans', system-ui, sans-serif" },
      "mkt-display": { "$value": "'Instrument Serif', 'Georgia', serif" },
      "mkt-body":    { "$value": "'Schibsted Grotesk', 'Helvetica Neue', Arial, sans-serif" },
      "mkt-mono":    { "$value": "'Iosevka Charon', 'JetBrains Mono', 'Fira Code', monospace" }
    },
    "size": {
      "ui-display":   { "$value": "32px" },
      "ui-title-m":   { "$value": "24px" },
      "ui-title-s":   { "$value": "20px" },
      "ui-body-s":    { "$value": "14px" },
      "ui-caption":   { "$value": "12px" },
      "ui-tiny":      { "$value": "11px" },
      "mkt-display":  { "$value": "80px" },
      "mkt-h1":       { "$value": "64px" },
      "mkt-h2":       { "$value": "48px" },
      "mkt-h3":       { "$value": "28px" },
      "mkt-h4":       { "$value": "22px" },
      "mkt-body-lg":  { "$value": "18px" },
      "mkt-body-md":  { "$value": "16px" },
      "mkt-body-sm":  { "$value": "14px" },
      "mkt-overline": { "$value": "11px" },
      "mkt-code":     { "$value": "14px" }
    },
    "letterSpacing": {
      "mkt-instrument": { "$value": "0em"    },
      "mkt-schibsted":  { "$value": "-0.01em" },
      "mkt-overline":   { "$value": "0.08em"  }
    }
  }
}