Midnight ink

A deep blue-black night lit by one warm amber lamp, for screens people use in the evening or want to feel premium and focused.

luxurious
serious
cool

The colours

6 colours, each with a role, then the palette at work on a small page.

Midnightbackground#12141c
Ink wellsurface#1c1f2b
Moonlit papertext#e9e6de
Starlight greymuted#a4a8b6
Lamp amberaccent#f2b84b
Night edgeborder#30344a

Text on background: 14.74:1 — passes AA

Spring open days

A garden worth the walk

Paths, ponds and a glasshouse full of ferns, open every weekend from April to June.

Plan a visit

New

The late tulip border

Two hundred bulbs, planted by volunteers last autumn.

A made-up page in this palette. Every text colour reaches at least 4.5:1 on its background; the heading, at 28px, may use a 3:1 pair.

Copy the idea

Take the palette with you as a brief for a person, as instructions for an AI assistant, or as design tokens: the colours, their roles and the pairs that are safe for text.

# Midnight ink — palette recipe

## The idea

- A deep blue-black night lit by one warm amber lamp, for screens people use in the evening or want to feel premium and focused.
- Mood: luxurious, serious, cool

## Use it for

- Media and streaming interfaces
- Developer and creative tools
- Evening and night-time apps

## Avoid it when

- Pages are long reading for daytime use
- The audience includes many older readers on dim screens

## Colours

- Midnight (background): #12141c
- Ink well (surface): #1c1f2b
- Moonlit paper (text): #e9e6de
- Starlight grey (muted): #a4a8b6
- Lamp amber (accent): #f2b84b
- Night edge (border): #30344a

## Accessible pairs

- Midnight on Moonlit paper — 14.7:1 (AA)
- Moonlit paper on Midnight — 14.7:1 (AA)
- Ink well on Moonlit paper — 13.2:1 (AA)
- Moonlit paper on Ink well — 13.2:1 (AA)
- Lamp amber on Midnight — 10.3:1 (AA)
- Midnight on Lamp amber — 10.3:1 (AA)
- Moonlit paper on Night edge — 9.8:1 (AA)
- Night edge on Moonlit paper — 9.8:1 (AA)
- Ink well on Lamp amber — 9.2:1 (AA)
- Lamp amber on Ink well — 9.2:1 (AA)
- Midnight on Starlight grey — 7.8:1 (AA)
- Starlight grey on Midnight — 7.8:1 (AA)
- Ink well on Starlight grey — 6.9:1 (AA)
- Starlight grey on Ink well — 6.9:1 (AA)
- Lamp amber on Night edge — 6.8:1 (AA)
- Night edge on Lamp amber — 6.8:1 (AA)
- Night edge on Starlight grey — 5.2:1 (AA)
- Starlight grey on Night edge — 5.2:1 (AA)

## Principles

- Midnight covers about 70% of the screen and ink well about 20%, for panels and cards
- Use moonlit paper, never pure white, for text to avoid glare
- Lamp amber goes on the single main action and on active states, under 5% of the screen
- Starlight grey for timestamps, labels and secondary details
- Show depth with lighter surfaces and night edge lines, not shadows

Design with the "Midnight ink" palette.

The idea: A deep blue-black night lit by one warm amber lamp, for screens people use in the evening or want to feel premium and focused.
The mood: luxurious, serious, cool.

It suits:
- Media and streaming interfaces
- Developer and creative tools
- Evening and night-time apps
It is a poor fit when:
- Pages are long reading for daytime use
- The audience includes many older readers on dim screens

Use these colours, each in its role:
- Midnight (background): #12141c
- Ink well (surface): #1c1f2b
- Moonlit paper (text): #e9e6de
- Starlight grey (muted): #a4a8b6
- Lamp amber (accent): #f2b84b
- Night edge (border): #30344a

Set text only in these colour pairs (text on background); use the ones marked (AA large) only for text at least 24px, or 18.66px bold:
- Midnight on Moonlit paper — 14.7:1 (AA)
- Moonlit paper on Midnight — 14.7:1 (AA)
- Ink well on Moonlit paper — 13.2:1 (AA)
- Moonlit paper on Ink well — 13.2:1 (AA)
- Lamp amber on Midnight — 10.3:1 (AA)
- Midnight on Lamp amber — 10.3:1 (AA)
- Moonlit paper on Night edge — 9.8:1 (AA)
- Night edge on Moonlit paper — 9.8:1 (AA)
- Ink well on Lamp amber — 9.2:1 (AA)
- Lamp amber on Ink well — 9.2:1 (AA)
- Midnight on Starlight grey — 7.8:1 (AA)
- Starlight grey on Midnight — 7.8:1 (AA)
- Ink well on Starlight grey — 6.9:1 (AA)
- Starlight grey on Ink well — 6.9:1 (AA)
- Lamp amber on Night edge — 6.8:1 (AA)
- Night edge on Lamp amber — 6.8:1 (AA)
- Night edge on Starlight grey — 5.2:1 (AA)
- Starlight grey on Night edge — 5.2:1 (AA)

Follow these principles:
- Midnight covers about 70% of the screen and ink well about 20%, for panels and cards
- Use moonlit paper, never pure white, for text to avoid glare
- Lamp amber goes on the single main action and on active states, under 5% of the screen
- Starlight grey for timestamps, labels and secondary details
- Show depth with lighter surfaces and night edge lines, not shadows

Apply the idea and the rules above; do not copy any existing website.

:root {
  --color-background: #12141c;
  --color-surface: #1c1f2b;
  --color-text: #e9e6de;
  --color-muted: #a4a8b6;
  --color-accent: #f2b84b;
  --color-border: #30344a;
}

Download brief (.md)

Accessible pairs

Every pair of colours that is readable as text, strongest first. AA pairs (4.5:1 or more) work at any size; AA large pairs (3:1 or more) only for text of 24px, or 18.66px bold.

Text on background	Contrast	Level
Midnight on Moonlit paper	14.7:1	AA
Moonlit paper on Midnight	14.7:1	AA
Ink well on Moonlit paper	13.2:1	AA
Moonlit paper on Ink well	13.2:1	AA
Lamp amber on Midnight	10.3:1	AA
Midnight on Lamp amber	10.3:1	AA
Moonlit paper on Night edge	9.8:1	AA
Night edge on Moonlit paper	9.8:1	AA
Ink well on Lamp amber	9.2:1	AA
Lamp amber on Ink well	9.2:1	AA
Midnight on Starlight grey	7.8:1	AA
Starlight grey on Midnight	7.8:1	AA
Ink well on Starlight grey	6.9:1	AA
Starlight grey on Ink well	6.9:1	AA
Lamp amber on Night edge	6.8:1	AA
Night edge on Lamp amber	6.8:1	AA
Night edge on Starlight grey	5.2:1	AA
Starlight grey on Night edge	5.2:1	AA

Where it fits

Use it for

Media and streaming interfaces
Developer and creative tools
Evening and night-time apps

Avoid it when

Pages are long reading for daytime use
The audience includes many older readers on dim screens

Principles

How much of each colour to use, and where.

Midnight covers about 70% of the screen and ink well about 20%, for panels and cards
Use moonlit paper, never pure white, for text to avoid glare
Lamp amber goes on the single main action and on active states, under 5% of the screen
Starlight grey for timestamps, labels and secondary details
Show depth with lighter surfaces and night edge lines, not shadows