Skip to content
SloplessTry the picker

Base style · pre-1900 · balanced

Classical Bookish

A well-made book on screen: an old-style serif on warm paper, a centred title page, small capitals and italics doing the hierarchy, generous book margins, marginal notes, footnotes and fleurons.

Moods
elegant, serious, calm, warm
Suits
education, legal, media, nonprofit, crafts, hospitality
Type
Libre Caslon Text

Principles

  • Centre the title matter like a title page; set running text on a book measure (columns 3–9) with the outer columns as margins
  • Carry hierarchy with italics, small capitals and size — never with bold, colour fills or boxes
  • Use one old-style serif family with old-style figures; ornament only with fleurons and thin or double rules
  • Annotate like a scholar: marginal notes in the outer margin, footnotes under a short rule, numbered sections and roman numerals
  • Keep everything still and square: no motion, no rounded corners, no shadows

Hard rules

  • No bold anywhere — not in headings, buttons or names; no sans-serif faces, no mono.
  • No colour fills except the primary button and the drop cap; no coloured section bands.
  • No rounded corners, shadows, gradients, glass or animation; hover is an underline, nothing moves.
  • No cards, icons, avatars, badges, pills or star ratings.
  • No full-width paragraphs and no ragged centred body copy — only short title matter is centred.
  • No modern display tricks: no rotated text, no overlapping images, no marquees, no giant numerals over 4 lines tall.

Full page preview with sample copy, rendered from the same tokens and layout the agent receives.

For coding agents

Rules and live patterns

Every pattern Classical Bookish owns, drawn by the same renderer as the picker with the style's default tokens and sample copy. Each has an anchor (#<pattern id>). A design's own DESIGN.md and tokens.json stay the source of truth; this page shows what the patterns look like.

Do

  • Set running text on a book measure: columns 3–9 (≤66 characters), with notes in the outer margin 10–12; centred matter (titles, quotes, plates) shares the page's centre axis.
  • Use one old-style serif family for everything (the pairing's heading and body faces); enable old-style figures and real small caps: `font-variant-numeric: oldstyle-nums; font-variant-caps: all-small-caps` for every `transform: uppercase` + `tracking: wide` text.
  • Carry hierarchy with italics, small capitals and the type scale (1.25); headings stay at weight 400.
  • Open the first paragraph after a title with a three-line drop cap in the accent colour; indent following paragraphs 1.5 em instead of spacing them.
  • Separate sections with a fleuron (the `star` shape, drawn as ❦ or ⁂ in the accent colour) or a thin rule; use the `double` border token for the nav, bookplates and the footer.
  • Number things classically: roman numerals for chapters and plates, § for sections, superscript numbers for footnotes.
  • Put marginal notes in italic small type, muted, top-aligned with the line they annotate; footnotes in small type under a 1 px rule a third of the measure wide.
  • Use grayscale engravings, etchings or archival photographs with a 1 px border, captioned in italic.
  • At 375 px: one column with 24 px margins, marginal notes drop under their paragraph (still italic and muted), keep centring for title matter.

Don't

  • No bold anywhere — not in headings, buttons or names; no sans-serif faces, no mono.
  • No colour fills except the primary button and the drop cap; no coloured section bands.
  • No rounded corners, shadows, gradients, glass or animation; hover is an underline, nothing moves.
  • No cards, icons, avatars, badges, pills or star ratings.
  • No full-width paragraphs and no ragged centred body copy — only short title matter is centred.
  • No modern display tricks: no rotated text, no overlapping images, no marquees, no giant numerals over 4 lines tall.
  • No all-caps set with ordinary capitals; caps are always small caps with letterspacing.
  • No more than one image per screen outside a plates gallery.

Heroes (4)

Title page

hero.bookish-title-page · hero

Rule
A book's title page, centred on one axis: author line at the top, title, fleuron and italic subtitle in the middle, and the imprint (CTA, rule, publisher line) at the foot.
Slots
eyebrow, headline, subhead, cta, meta
Notes
The three groups are spaced top / middle / bottom over at least 90 vh, like a printed title page. Title at step 6, weight 400, in the heading face; everything centred.

A printed title page over at least 90 vh, everything centred: at the top the small-caps eyebrow (author or house); in the middle the title at step 6 (weight 400, ≤18 ch), a fleuron, and the italic subtitle (≤44 ch); at the foot an underlined CTA, a 1 px rule and the imprint line in small caps ("London · MMXXVII"). Space the three groups evenly top to bottom.

Brand & product studio

We make complicated companies simple to choose

Northfold is a 14-person studio helping manufacturers, labs and B2B teams explain what they do — and look like they mean it.

Start a project

Booking projects from June 2026

Desktop

Brand & product studio

We make complicated companies simple to choose

Northfold is a 14-person studio helping manufacturers, labs and B2B teams explain what they do — and look like they mean it.

Start a project

Booking projects from June 2026

Phone, 390 px

Frontispiece

hero.bookish-frontispiece · hero

Rule
A two-page opening: a bordered engraving-style 3:4 plate with an italic caption on the left page (2–6), the gutter in column 7, and the centred title on the right page (8–11).
Slots
heroImage, caption, eyebrow, headline, subhead, cta
Grid
plate 2-6 · gutter 7-7 · title 8-11

A two-page opening. Left page 2–6: a grayscale 3:4 plate with a 1 px border and an italic caption centred under it. Column 7: a 1 px vertical rule as the book's gutter (hidden on phones). Right page 8–11, vertically centred: small-caps eyebrow, the h1 at step 5 (≤16 ch), a fleuron, the italic subhead and an underlined CTA, all centred.

Corvid Robotics — identity

Brand & product studio

We make complicated companies simple to choose

Northfold is a 14-person studio helping manufacturers, labs and B2B teams explain what they do — and look like they mean it.

Start a project
Desktop

Corvid Robotics — identity

Brand & product studio

We make complicated companies simple to choose

Northfold is a 14-person studio helping manufacturers, labs and B2B teams explain what they do — and look like they mean it.

Start a project
Phone, 390 px

Chapter opening

hero.classical-chapter-opening · hero

Rule
A chapter's first page: a large roman numeral and a small-caps chapter line centred in 4–9, the italic title in 3–10, a short rule, then the opening paragraph with a drop cap in 3–9 and a marginal note in 10–12.
Slots
index, eyebrow, headline, lead, meta, cta
Grid
numeral 4-9 · title 3-10 · text 3-9 · margin 10-12
Notes
The lead's first letter is a three-line drop cap in the accent colour. The marginal note is italic, small and muted, top-aligned with the paragraph.

Centred in 4–9: a roman numeral at step 7 (weight 400) and a small-caps chapter line. The italic h1 at step 5 centred across 3–10, then a short centred rule (columns 6–7). The opening paragraph (lead) on 3–9 with an accent drop cap three lines tall; beside it in 10–12, top-aligned, an italic muted marginal note. An underlined CTA in 3–6.

06

Brand & product studio

We make complicated companies simple to choose

Northfold is a 14-person studio helping manufacturers, labs and B2B teams explain what they do — and look like they mean it.

Booking projects from June 2026

Start a project
Desktop

06

Brand & product studio

We make complicated companies simple to choose

Northfold is a 14-person studio helping manufacturers, labs and B2B teams explain what they do — and look like they mean it.

Booking projects from June 2026

Start a project
Phone, 390 px

Epigraph

hero.bookish-epigraph · hero

Rule
An italic epigraph set flush right in 7–11 at the top; the title low on the page in 2–9, the lead and a CTA under it in 2–7, and a muted note in 10–11.
Slots
quote, author, headline, subhead, cta, meta
Grid
epigraph 7-11 · title 2-9 · lead 2-7 · note 10-11

At the top, flush right in 7–11: the epigraph in italic and its author in small caps. Low on the page (bottom-aligned): the display title at step 6 in 2–9, then the lead and a secondary button in 2–7 and an italic muted note in 10–11.

“They understood our product faster than our own sales team did.”

Hanna Lindqvist

We make complicated companies simple to choose

Northfold is a 14-person studio helping manufacturers, labs and B2B teams explain what they do — and look like they mean it.

Start a project

Booking projects from June 2026

Desktop
“They understood our product faster than our own sales team did.”

Hanna Lindqvist

We make complicated companies simple to choose

Northfold is a 14-person studio helping manufacturers, labs and B2B teams explain what they do — and look like they mean it.

Start a project

Booking projects from June 2026

Phone, 390 px

Navigation (2)

Content blocks (14)

Text with marginalia

content.bookish-marginalia · content

Rule
A centred small-caps label and title over a 3–9 text block with a drop-capped lead; a marginal note sits in 10–12 beside it and a footnote closes the block under a short rule.
Slots
sectionLabel, title, lead, meta, body2, caption
Grid
text 3-9 · margin 10-12

Centred small-caps label and h2 (weight 400) on 3–9. Then the lead with a drop cap on 3–9 and, beside it in 10–12, an italic muted marginal note marked with a dagger (†). The body continues on 3–9 with indented paragraphs; a 1 px rule across 3–5 and the footnote in small muted type close the block.

About

How we think

Each engagement starts with a two-week audit: interviews with customers, sales and the people who build the product. The brief writes itself after that.

Booking projects from June 2026

We hand over everything — source files, a living brand system and a website your team can edit without calling us.

Corvid Robotics — identity

Desktop

About

How we think

Each engagement starts with a two-week audit: interviews with customers, sales and the people who build the product. The brief writes itself after that.

Booking projects from June 2026

We hand over everything — source files, a living brand system and a website your team can edit without calling us.

Corvid Robotics — identity

Phone, 390 px

Table of contents

list.bookish-table-of-contents · list

Rule
A centred 'Contents' title, then entries on a 2–11 measure: small-caps roman numeral right-aligned in 2–3, italic title in 4–9, page number right-aligned in 10–11, joined by dotted leaders.
Slots
title, items[4..10]
Grid
numeral 2-3 · title 4-9 · page 10-11

A centred small-caps "Contents". Each entry on one baseline: the roman numeral in small caps, right-aligned in 2–3; the italic title in 4–9; the page number right-aligned in 10–11, joined to the title by a dotted leader (`border-bottom: 1px dotted` on a flex spacer). No rules between entries.

Services

01

Discovery sprint

2 weeks

02

Positioning workshop

1 day

03

Identity design

8 weeks

04

Website

10 weeks

05

Launch support

4 weeks

06

Retainer

Ongoing

Desktop

Services

01

Discovery sprint

2 weeks

02

Positioning workshop

1 day

03

Identity design

8 weeks

04

Website

10 weeks

05

Launch support

4 weeks

06

Retainer

Ongoing

Phone, 390 px

Numbered sections

features.bookish-numbered-sections · features

Rule
Label and italic title in 2–4; three to six sections run down 5–10 as numbered paragraphs (§ 1, § 2…), each a small-caps number, an italic h3 and a paragraph.
Slots
sectionLabel, title, features[3..6]
Grid
title 2-4 · sections 5-10

Small-caps label and an italic h2 (≤14 ch) in 2–4, top-aligned. Three to six sections down 5–10, 30 px apart: "§ 1" in small caps, the italic h3 (weight 400), a paragraph ≤60 ch.

What you get

What we do

01

Positioning

Find the one sentence your best customers already believe.

02

Identity systems

Logos, type and colour that work on a factory floor and a pitch deck.

03

Websites

Fast, editable sites built on the CMS your team already knows.

04

Sales enablement

Decks, one-pagers and demos your reps actually use.

Desktop

What you get

What we do

01

Positioning

Find the one sentence your best customers already believe.

02

Identity systems

Logos, type and colour that work on a factory floor and a pitch deck.

03

Websites

Fast, editable sites built on the CMS your team already knows.

04

Sales enablement

Decks, one-pagers and demos your reps actually use.

Phone, 390 px

Epigraph quote

testimonial.bookish-epigraph-quote · testimonial

Rule
A fleuron, then one quote in italic at step 3 centred on a narrow measure, the attribution in small caps after an em dash, the source in italic.
Slots
quote, author, role

Centred on a narrow measure with 72 px padding: an accent fleuron, the quote in italic at step 3 (≤44 ch), "— Name" in small caps, the source in italic muted type.

“They understood our product faster than our own sales team did.”

Hanna Lindqvist

CEO, Corvid Robotics

Desktop
“They understood our product faster than our own sales team did.”

Hanna Lindqvist

CEO, Corvid Robotics

Phone, 390 px

Table of figures

stats.bookish-figures-table · stats

Rule
An italic title centred over 3–10, then three to five ruled rows on an 8-column sub-grid: the description in italic (1–6) and the figure right-aligned in old-style numerals (7–8).
Slots
title, stats[3..5]
Grid
table 3-10

An italic h3 centred over 3–10, then three to five rows with 1 px rules on an 8-column sub-grid: the description in italic (1–6) and the figure in old-style numerals at step 2, right-aligned (7–8).

Twelve years in numbers

launches shipped

140+

years independent

12

clients return

9 of 10

average lift in demo requests

31%

Desktop

Twelve years in numbers

launches shipped

140+

years independent

12

clients return

9 of 10

average lift in demo requests

31%

Phone, 390 px

Plates

gallery.bookish-plates · gallery

Rule
A centred small-caps 'Plates' label, then two to four bordered grayscale 3:4 plates, two per row across 2–11, each with 'Plate I.' in small caps and an italic caption centred under it.
Slots
sectionLabel, items[2..4]
Grid
label 1-12 · plates 2-11

A centred small-caps "Plates" label, then two to four grayscale 3:4 plates with a 1 px border, two per row across 2–11 with a wide gap; under each, "Plate I." in small caps and an italic caption, both centred.

Gallery

01

Corvid Robotics — identity

02

Fieldstack — website

03

Tidewater Labs — naming

04

Arklow — trade show

Desktop

Gallery

01

Corvid Robotics — identity

02

Fieldstack — website

03

Tidewater Labs — naming

04

Arklow — trade show

Phone, 390 px

Dialogue

faq.bookish-dialogue · faq

Rule
Questions set as a printed dialogue on a 3–10 measure: italic question, then the answer in roman, each prefixed by a small-caps Q. / A. hanging in column 2.
Slots
title, faqs[4..8]
Grid
speaker 2-2 · text 3-10

A centred italic h2, then four to eight exchanges on the 3–10 measure: the question in italic (h4, weight 400) and the answer in roman under it, with "Q." and "A." in small caps hanging right-aligned in column 2 beside each line.

Working together

General

How big are your projects?

Most run 8–16 weeks with a team of three to five people.

Ordering

Do you work with startups?

Yes, from Series A onwards, when there's a product and paying customers.

Support

Do you build the website too?

We design and build, then train your team to run it.

Policies

Where are you based?

Lisbon and London, working with clients across Europe and North America.

Practical

Can we hire you for a single deliverable?

Occasionally — a naming project or a sales deck. Ask us.

Desktop

Working together

General

How big are your projects?

Most run 8–16 weeks with a team of three to five people.

Ordering

Do you work with startups?

Yes, from Series A onwards, when there's a product and paying customers.

Support

Do you build the website too?

We design and build, then train your team to run it.

Policies

Where are you based?

Lisbon and London, working with clients across Europe and North America.

Practical

Can we hire you for a single deliverable?

Occasionally — a naming project or a sales deck. Ask us.

Phone, 390 px

Ex libris

cta.bookish-ex-libris · cta

Rule
A bookplate: one bordered panel centred in 4–9 with a small-caps label, a fleuron, an italic h2, a short line and the primary button, all centred.
Slots
eyebrow, headline, body, cta
Grid
plate 4-9

One bookplate centred in 4–9 with a `double` border, padded 36 px: small-caps "Ex libris", a fleuron, an italic h2, one short line and the primary button (square, accent fill, small-caps label).

Brand & product studio

Have a hard thing to explain?

Each engagement starts with a two-week audit: interviews with customers, sales and the people who build the product. The brief writes itself after that.

Start a project
Desktop

Brand & product studio

Have a hard thing to explain?

Each engagement starts with a two-week audit: interviews with customers, sales and the people who build the product. The brief writes itself after that.

Start a project
Phone, 390 px

Correspondence

contact.bookish-correspondence · contact

Rule
A letter-style block in 3–7 (italic title, 'Letters may be addressed to', address, email, hours) and the contact form in 8–11.
Slots
title, body, address, email, hours, contact
Grid
letter 3-7 · form 8-11

In 3–7: italic h2, "Letters may be addressed to" in italic, the address, email and muted hours. In 8–11: the contact form with underlined fields (1 px bottom border) and italic labels.

Start a conversation

Each engagement starts with a two-week audit: interviews with customers, sales and the people who build the product. The brief writes itself after that.

Rua da Boavista 72, 1200-066 Lisboa

hello@northfold.com

Studio open Mon–Thu, 9:30–18:00

Name
Your name
Email
you@example.com
Message
Tell us a little about your project…
Send message
Desktop

Start a conversation

Each engagement starts with a two-week audit: interviews with customers, sales and the people who build the product. The brief writes itself after that.

Rua da Boavista 72, 1200-066 Lisboa

hello@northfold.com

Studio open Mon–Thu, 9:30–18:00

Name
Your name
Email
you@example.com
Message
Tell us a little about your project…
Send message
Phone, 390 px

Index of essays

blog.bookish-index-of-essays · blog

Rule
A centred italic title, then four to ten ruled entries on the 2–11 measure: small-caps date in 2–3, italic title in 4–9, author right-aligned in 10–11.
Slots
title, posts[4..10]
Grid
date 2-3 · title 4-9 · author 10-11

A centred italic h2, then four to ten entries with 1 px rules: small-caps date in 2–3, italic title in 4–9, the author right-aligned in 10–11, on one baseline.

Field notes

Apr 3, 2026 · 8 min

Your homepage is a sales call nobody attends

Apr 3, 2026 · 8 min

Mar 1, 2026 · 5 min

The case against the brand book

Mar 1, 2026 · 5 min

Jan 22, 2026 · 6 min

Naming a product in 2026

Jan 22, 2026 · 6 min

Dec 9, 2025 · 4 min

Industrial brands deserve good type

Dec 9, 2025 · 4 min

Desktop

Field notes

Apr 3, 2026 · 8 min

Your homepage is a sales call nobody attends

Apr 3, 2026 · 8 min

Mar 1, 2026 · 5 min

The case against the brand book

Mar 1, 2026 · 5 min

Jan 22, 2026 · 6 min

Naming a product in 2026

Jan 22, 2026 · 6 min

Dec 9, 2025 · 4 min

Industrial brands deserve good type

Dec 9, 2025 · 4 min

Phone, 390 px

Subscription ledger

pricing.bookish-subscription-ledger · pricing

Rule
An italic title centred over 3–10, then two to four plans as ruled ledger rows on an 8-column sub-grid: plan name 1–3, italic terms 4–6, price right-aligned 7–8; one underlined CTA below.
Slots
title, plans[2..4], cta
Grid
ledger 3-10

An italic h2 centred over 3–10. Two to four plans as ledger rows with 1 px rules on an 8-column sub-grid: plan name in 1–3, italic terms in 4–6, price right-aligned at step 2 in 7–8. One underlined CTA centred below.

Engagements

Sprint

Two-week positioning sprint with a written brand platform.

€18k

Rebrand

Positioning, identity and a launch toolkit over 12 weeks.

€85k

Partner

A standing team for product launches and campaigns.

€14k/mo

Start a project
Desktop

Engagements

Sprint

Two-week positioning sprint with a written brand platform.

€18k

Rebrand

Positioning, identity and a launch toolkit over 12 weeks.

€85k

Partner

A standing team for product launches and campaigns.

€14k/mo

Start a project
Phone, 390 px

Dramatis personae

team.bookish-dramatis-personae · team

Rule
A cast list: centred italic title, then four to ten people, each name in small caps right-aligned in 3–6 facing an italic role in 7–10. No portraits.
Slots
title, team[4..10]
Grid
name 3-6 · role 7-10

A cast list: centred italic h2, then each person on one baseline — the name in small caps right-aligned in 3–6, the role in italic in 7–10. No portraits.

The studio

Rita Carvalho

Founder, strategy

Owen Blake

Design director

Sana Qureshi

Lead developer

Mateus Lima

Copy and naming

Desktop

The studio

Rita Carvalho

Founder, strategy

Owen Blake

Design director

Sana Qureshi

Lead developer

Mateus Lima

Copy and naming

Phone, 390 px

List of subscribers

logos.bookish-subscribers · logos

Rule
A centred small-caps label, then six to twelve names set in italic in three centred columns across 3–10, as in a book's list of subscribers.
Slots
sectionLabel, clients[6..12]
Grid
list 3-10

A centred small-caps label ("Among our subscribers"), then six to twelve names in italic, centred in three columns across 3–10. Names only.

Trusted by

Corvid Robotics

Fieldstack

Tidewater Labs

Arklow Valves

Mosswood Bio

Kestrel Freight

Desktop

Trusted by

Corvid Robotics

Fieldstack

Tidewater Labs

Arklow Valves

Mosswood Bio

Kestrel Freight

Phone, 390 px

Footers (2)

Colophon

footer.bookish-colophon · footer

Rule
A centred colophon: fleuron, an italic paragraph naming the typefaces and the press, plain links, and the legal line in small caps.
Slots
body, pages, legal

Under a `double` top rule, centred: a fleuron, an italic colophon paragraph (≤60 ch: "Set in Libre Caslon and printed in Bath"), plain links, and the legal line in muted small caps.

Each engagement starts with a two-week audit: interviews with customers, sales and the people who build the product. The brief writes itself after that.

  • Services
  • Work
  • About
  • Contact

© 2026 Northfold. All rights reserved.

Desktop

Each engagement starts with a two-week audit: interviews with customers, sales and the people who build the product. The brief writes itself after that.

  • Services
  • Work
  • About
  • Contact

© 2026 Northfold. All rights reserved.

Phone, 390 px

Imprint line

footer.classical-imprint-line · footer

Rule
Under a rule, three zones on one baseline: wordmark in 1–4, italic address centred in 5–8, legal line right-aligned in 9–12.
Slots
siteName, address, legal
Grid
logo 1-4 · address 5-8 · legal 9-12

A 1 px rule across the grid, then one baseline: wordmark in 1–4, the italic address centred in 5–8, the muted legal line right-aligned in 9–12.

Northfold

Rua da Boavista 72, 1200-066 Lisboa

© 2026 Northfold. All rights reserved.

Desktop
Northfold

Rua da Boavista 72, 1200-066 Lisboa

© 2026 Northfold. All rights reserved.

Phone, 390 px

Hero library heroes that suit Classical Bookish

Magazine coverhero.editorial-cover · editorialA masthead (site name at step 8, full width) over a dateline rule; the cover photo fills 4–12; cover lines (3–5 numbered teasers) run down 1–3; the headline overlaps the photo's lower-left on a page-colour field.Editorial drop caphero.editorial-dropcap · editorialA narrow measure (columns 2–10) carries eyebrow, a headline, byline and rule; the opening paragraph runs 2–10 and starts with a four-line drop cap; a marginal note sits in 11–12.Editorial columnshero.editorial-columns · editorialA ruled kicker bar spans the page; the headline runs 1–8 at step 7; below it a deck in 1–4 and a ruled text column in 5–8 start the story; a captioned 3:4 photo fills 9–12 beside both.Editorial indexhero.editorial-index · editorialThe hero is a table of contents: headline, subhead and link in 1–5 (sticky), and a ruled list of 4–7 numbered entries (number, title, meta) in 7–12; column 6 stays empty.Single linehero.minimal-single-line · minimalOne sentence as the h1 at step 4, flush left across 1–10 and vertically centred in a 60vh hero; one text link with an arrow in 11–12 on the same line. Nothing else.Statement, bottom-lefthero.minimal-statement-left · minimalA tall, quiet hero: a mono index top-left and meta top-right on one row, and a two-to-three-line statement as the h1 at step 5 sitting on the bottom-left (1–9), with one underline link under it.Full-bleed in a mat framehero.fullbleed-framed · full-bleedThe photo fills the viewport inside an even mat of page colour (one space step 3 on all sides); four labels sit in the mat's corners: eyebrow top-left, meta top-right, headline bottom-left, CTA bottom-right.