Kestrel Mill
Stone-ground flour from a single named farm, milled the week you order it.
Why it looks like this
A dark, grain-dusted ground with warm gold accent reads as a working mill after hours — serious, elemental, and expensive — positioning Kestrel Mill against bright agrarian kitsch and signalling to a chef that this is a craftsperson's product, not a farmers'-market prop.
Colour
bg
#1c1a17
the page ground
surface
#272420
raised cards and panels
ink
#ede8df
primary text
muted
#958c83
secondary text
accent
#c8a951
the one bold colour, used sparingly
accent-ink
#1c1a17
text on the accent
border
#35302a
hairlines and dividers
Contrast, measured
| pair | measured | WCAG needs | verdict |
|---|---|---|---|
| body text on the page | 14.23:1 | 4.5:1 | passes |
| secondary text on the page | 5.26:1 | 4.5:1 | passes |
| body text on a card | 12.66:1 | 4.5:1 | passes |
| the accent on the page | 7.65:1 | 3:1 | passes |
| text on the accent | 7.65:1 | 4.5:1 | passes |
Type
Display Cormorant Garamond · body Karla · scale 1.414
- --s--1labels, captions, footnotesAg
- --s-0body copyAg
- --s-1subheads and buttonsAg
- --s-2the deck — the one large secondary voiceAg
- --s-3headlinesAg
- --s-4the largest displayAg
The mark at small sizes
The wordmark above is the primary lockup. Where it will not fit — a browser tab, an app icon, an avatar — the identity falls back to a monogram in the accent. Shown at 64, 40 and 24 pixels, which are the sizes it will actually be seen at.
The tokens — paste this into your stylesheet
:root{--bg:#1c1a17;--surface:#272420;--ink:#ede8df;--muted:#958c83;--accent:#c8a951;--accent-ink:#1c1a17;--border:#35302a;--display:"Cormorant Garamond",Georgia,"Times New Roman",serif;--body:"Karla",-apple-system,system-ui,"Segoe UI",sans-serif;--display-w:700;--display-w2:600;--ratio:1.414;--s--1:0.707rem;--s-0:1rem;--s-1:1.414rem;--s-2:1.999rem;--s-3:2.827rem;--s-4:3.998rem}
https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600;700&family=Karla:wght@400;500;600&display=swap