← All palettes
Editorial · No. 03

Paper

Warm vellum, deep ink-brown and terracotta. Built for long, unhurried reading.

light warmliteraryquiet
Get the tokens
The idea

Inspired by old manuscripts and well-loved paperbacks. The cream background is gentler than white during long reading sessions, ink-brown text keeps contrast high without feeling harsh, and terracotta brings a touch of fired clay to links. EB Garamond and Lora are both designed for long-form text.

Mode
Light
Family
Editorial
Good for
blog, writing, poetry
Fonts
EB Garamond + Lora
Colours

Eleven roles

Click any swatch to copy its hex code.

Accessibility

Contrast check

Worked out when the site is built, using the WCAG 2 formula.

Body text on background#322A26 on #F4EBE1
The quick brown fox jumps over the lazy dog
11.92:1
AAA
Headings on background#2A211D on #F4EBE1
The quick brown fox jumps over the lazy dog
13.36:1
AAA
Muted text on background#6B5F58 on #F4EBE1
The quick brown fox jumps over the lazy dog
5.24:1
AA
Links on background#9E4A2B on #F4EBE1
The quick brown fox jumps over the lazy dog
5.14:1
AA
Text on raised cards#322A26 on #EBE0D3
The quick brown fox jumps over the lazy dog
10.79:1
AAA
Button label on accent#FFF8F0 on #9E4A2B
The quick brown fox jumps over the lazy dog
5.75:1
AA
Accent shapes on background#9E4A2B on #F4EBE1
The quick brown fox jumps over the lazy dog
5.14:1
AA

AAA ≥ 7:1 and AA ≥ 4.5:1 for normal text. AA Large ≥ 3:1 is enough for large headings, icons and button shapes.

Typography

The font pairing

Every font is self-hosted, so pages load without calling a third-party font service.

Aa
Headings
EB Garamond

Small rooms full of light

Aa
Body
Lora

Good body type disappears: you stop noticing letters and start reading the story they carry.

{}
Code
JetBrains Mono

const palette = "paper"; // 0O 1lI =>

In use

A page in Paper

Headings, links, quotes, code, buttons and cards together.

Paper Journal EssaysNotesAbout
warm · 6 min read

What a colour remembers

14 October 2026 · by the editors

Colour is never just decoration. A background sets the temperature of a room before a single word is read, and an accent tells the eye where to go next. Choose them together and a site starts to feel like a place.

A palette is a promise about how a page will feel.
// apply the palette
const root = document.querySelector("html");
root.dataset.lbTheme = "paper";
Subscribe Read the archive
Use it

Copy the tokens

Paste into your own project. The font names match the files listed on the Credits page.

/* Paper: Warm vellum, deep ink-brown and terracotta. Built for long, unhurried reading. */
:root {
  --color-bg:          #F4EBE1;
  --color-bg-alt:      #EBE0D3;
  --color-surface:     #EFE3D5;
  --color-text:        #322A26;
  --color-heading:     #2A211D;
  --color-muted:       #6B5F58;
  --color-accent:      #9E4A2B;
  --color-accent-2:    #4F6B4A;
  --color-link:        #9E4A2B;
  --color-border:      #D8CCBE;
  --color-on-accent:   #FFF8F0;

  --font-heading: 'EB Garamond', Garamond, Georgia, serif;
  --font-body:    'Lora', Georgia, serif;
  --font-mono:    'JetBrains Mono', ui-monospace, Consolas, monospace;
}