Railblocks ⬩ Typography
Railblocks
[ Graphic language ⬩ Typography ]

Newsreader for headings. IBM Plex for text.

Two families, three roles. Newsreader for headings. IBM Plex Sans for paragraphs and interface text. IBM Plex Mono for labels, code and figures.

No italicNot in headings, body, labels or emphasis. Emphasis is weight, never slant.
[ Section 01 ]01 / 07

Overview

Each section covers what the typeface is, why it suits our clients, and how to set it.

1Headings
Newsreader
400500

Classical, authoritative and calm. Gives the brand institutional weight without decoration.

2Text
IBM Plex Sans
400500600

Clear, precise and minimal. Designed as a corporate system typeface, so it won’t look dated.

3Labels
Plex Mono
400500

Plex Sans at a fixed width. For eyebrows, codes, statuses and anything a system produced.

[ Section 02 ]02 / 07

Headings

Newsreader is a newspaper serif. It suits us for three reasons: thick and thin strokes are close in weight, so it looks steady; it has no flourishes; and its letters sit close, so a heading reads as one block. It looks cleaner the larger it is set.

Newsreader ⬩ 400 & 500
Fig. 1 ⬩ Newsreader 400Specimen
Own the systems behind your work.ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
1234567890 ⬩ $18.0M ⬩ 02 / 04 ⬩ &@§¶
Why it fits

Our clients buy on credibility, not novelty. Newsreader looks established, like the type of newspapers, journals and law firms, not a new startup font. It also reads well small, which matters because many headings appear in memos, decks and briefs.

How to set it

Two weights: 400 for almost everything, 500 when a heading sits on a coloured background. Keep font-optical-sizing: auto on so letter shapes adjust to size.

Do+ Always
01Use 400 by default. If a heading feels weak, make it larger or shorter before switching to 500.
02Open each section with a mono eyebrow, then a serif heading, then a Plex intro paragraph. This order is the brand’s signature.
03Let headings balance to 20–24ch with text-wrap: balance.
04Keep headings in Ink on light grounds, Paper on dark.
Don’t− Never
01Use Newsreader below 20px, or for interface strings. Buttons, inputs and nav are Plex.
02Use 600 or 700, or italic. Ever.
03Set headings in all-caps or letterspace the serif.
04Lock the optical size axis by hand.
[ Section 03 ]03 / 07

Text

Our readers check details: they skim, compare and verify numbers. Plex handles long paragraphs, dense tables and interface labels in one family, and its figures line up between a table and its caption.

IBM Plex Sans ⬩ body & interface
Fig. 2 ⬩ IBM Plex Sans 40020px ⬩ 14px

Railblocks helps private equity and venture capital firms become AI-native by building AI operating systems they own and control, connecting a firm’s data, workflows, tools and agents in one coherent environment.

Interface text, captions and table cells are 14px. Emphasis uses weight 600, never italic.

1
Engineered, not styled.

Commissioned by IBM as a neutral corporate typeface. No startup styling, so it won’t date.

2
Built for figures.

A clear 1 and tabular figures: what a page full of numbers needs.

3
Slightly warm.

Just warm enough to pair with Newsreader, where a colder sans would feel separate.

Do+ Always
01Set every paragraph, standfirst, caption and interface string in Plex Sans.
02Hold prose to a 68ch measure, standfirsts to 46ch.
03Use weight 600 for emphasis inside body copy.
04Use tabular figures in tables, counters and anything that updates.
Don’t− Never
01Set a heading in Plex Sans. Headings are Newsreader, without exception.
02Use italic, for emphasis or anything else.
03Introduce a fourth family. If something needs another voice, change weight or size.
04Go below 12px for anything a reader must parse.
[ Section 04 ]04 / 07

Labels

Our copy includes part codes, step counters, endpoints and currency. Plex was chosen because its mono was designed alongside the sans; without that, figures and punctuation don’t line up between a table and its caption. Mono labels look like part numbers on a tool, which suits the brand.

IBM Plex Mono ⬩ uppercase ⬩ tracked
Fig. 3a ⬩ Plex Mono 500Labels
[ Railstack ⬩ Phase 02 / 04 ]A-01 ⬩ Intake rail
LiveR3
Fig. 3b ⬩ Plex Mono 400 ⬩ inline code
01GET /v1/workflows/:id → 20002context.sources[4]03$18.0M ⬩ 1,300
1
Same skeleton as the sans.

Plex Mono is Plex Sans at a fixed width, with the same shapes. Labels read as part of the text they describe.

2
It marks machine output.

Codes, endpoints, IDs, timestamps, statuses and step counters. If a system produced it, set it in mono.

3
It carries the eyebrow.

Uppercase and tracked to +0.14em. It opens sections and labels the topic above a serif heading.

Do+ Always
01Use mono for anything a machine produced: codes, endpoints, IDs, timestamps, statuses, counters.
02Keep labels uppercase and tracked out to +0.14em.
03Use it for eyebrows, chips, buttons and small table headers.
04Use 500 for labels, 400 for inline code.
Don’t− Never
01Set a paragraph in mono. It reads like a terminal.
02Set a label in lowercase mono. Uppercase is what makes it read as a label.
03Use it for headings or for a standfirst.
04Set mono below 10px, where the letter spacing closes up.
[ Section 05 ]05 / 07

Scale

One scale for three roles. Display sizes are Newsreader, text sizes are Plex Sans, label sizes are Plex Mono in uppercase. Sizes are in rem, so everything scales together.

Tokens ⬩ live at size
TokenSizeFamilySpecimen
--rb-size-display-172 / 4.5remNewsreader 400Hero
--rb-size-display-252 / 3.25remNewsreader 400Section opener
--rb-size-display-336 / 2.25remNewsreader 400Subsection heading
--rb-size-display-426 / 1.625remNewsreader 400/500Card title
--rb-size-lead20 / 1.25remPlex Sans 400Standfirst paragraph, 46ch
--rb-size-body16 / 1remPlex Sans 400Body copy at a 68ch measure
--rb-size-small14 / 0.875remPlex Sans 400/500Interface strings, captions, cells
--rb-size-micro12 / 0.75remPlex Sans 400Footnotes and dense metadata
--rb-size-label12 / 0.75remPlex Mono 500[ Bracketed eyebrow ]
--rb-size-label-lg13 / 0.8125remPlex Mono 500Button ⬩ status ⬩ A-01
Schedule 01 ⬩ Type scale10 tokens
RefStoneValue
S1TrackingHeadings tighten to −0.022em, body stays at 0, mono labels open to +0.14em in uppercase.
S2Leading1.04 for display, 1.2 for multi-line card titles, 1.62 for body, 1.4 for dense interface text.
S3Measure68ch prose, 46ch standfirsts, 20–24ch headings.
S4FallbacksNewsreader → Iowan Old Style → Georgia. Plex Sans → Helvetica Neue → system-ui. Plex Mono → SF Mono → Menlo.
Schedule 02 ⬩ Setting04 rows
Do+ Always
01Pick the nearest token rather than a new size.
02For more contrast, move a full step (display-2 to display-4), not 52px to 44px.
03Let the tokens carry tracking and leading.
04Use display-1 once per page at most.
Don’t− Never
01Create an in-between size or a one-off letter-spacing value.
02Mix two display sizes inside one heading block.
03Scale type with transforms. Change the token.
04Use a display token for anything under 20px.
[ Section 06 ]06 / 07

Text colours

Type uses only named steps of the Tools palette, and the background decides which. On light backgrounds: Ink, Walnut, Leather and Clay. On Ink: Paper, Stone and Terracotta.

Four inks on light ⬩ three on dark
RefRolePalette stepOn PaperLive
C1Headings & emphasisInk ⬩ #0D050316.0 : 1Own the systems behind your work
C2Body & captionsWalnut ⬩ #49372D9.2 : 1The default reading colour for every paragraph.
C3Mono labels & metaLeather ⬩ #7E69594.6 : 1Eyebrows ⬩ part codes
C4Links & accent typeClay ⬩ #B146335.1 : 1Read the philosophy
Schedule 03 ⬩ Text colours04 roles
Fig. 4a ⬩ On PaperInk ⬩ Walnut ⬩ Clay
Rent the model. Own the rails.Body copy in Walnut, with an accent link in Clay.
Fig. 4b ⬩ On InkPaper ⬩ Stone ⬩ Terracotta
Rent the model. Own the rails.Body copy in Stone, with an accent link in Terracotta.
Do+ Always
01Use Walnut for every paragraph and Ink for every heading.
02Switch Clay to Terracotta whenever type sits on Ink.
03Keep Leather for uppercase mono labels on Paper only.
04Set type at full opacity. Use a different named step instead of fading it.
Don’t− Never
01Set a sentence in Leather, or use it on Plaster or Chalk.
02Use Clay on a dark ground. Use Terracotta.
03Colour type with a Matter colour (Sage, Slate, Bronze, Rose). Those are fills.
04Use opacity or colour-mix to make a softer grey.
[ Section 07 ]07 / 07

Downloads

The three families as desktop fonts, for decks, documents and design tools. All three are open source under the SIL Open Font License; each package includes the licence.

ttf ⬩ otf ⬩ zip
1Headings
Newsreader

42 styles: 6pt, 16pt and 72pt optical sizes, ExtraLight to ExtraBold, with italics.

SIL OFL 1.1 ⬩ productiontype/Newsreader
2Text
IBM Plex Sans

16 styles: Thin to Bold, with italics.

SIL OFL 1.1 ⬩ IBM/plex
3Labels
Plex Mono

16 styles: Thin to Bold, with italics.

SIL OFL 1.1 ⬩ IBM/plex