Our brand
Everything comes in three
Scroll any page on this site and the background travels: off-white, into cream, then through one or two of our three accents, holding the last of them all the way down. It never travels to black. The footer arrives instead, as a field of black pixels dissolving in over whatever colour the page has landed on.
That trip is what shapes the palette. A colour strong enough to fill a pill behind black type is far too pale to be read as type itself, and far too heavy to lie under an entire page. So each accent is kept as three values, one per job: a bright that only fills, a deeper one that only writes, and a washed one that only grounds. They are never swapped, and none is used outside its job.
The washed values are not eyeballed. Each is 20% of its own bright mixed into cream, which is the entire rule — no per-colour tuning. It lands all three within 4 points of the same weight, so travelling from one to the next changes the hue of the page without changing how heavy it feels.
Three colours, nine values
Each specimen below shows all three forms of one hue, each doing the job it exists for. First the bright fills a block and carries black type. Then the deeper value writes on cream. Then the washed value is a whole ground, with the page’s own ink on it. Every figure is measured, not asserted.
The primary call to action, and every dot marking the practice
Black type on this fill — 6.87:1
Links, labels and hairlines on any of our grounds
On cream 5.40:1 · on off-white 5.70:1
A stop on most journeys — home, About, Work, Services
Body copy on this ground — 12.85:1
Fills that need to carry weight, and the Web practice dot
Black type on this fill — 7.45:1
Every link hover on the site, in body copy and in headlines
On cream 7.74:1 · on off-white 8.16:1
A stop on four journeys, and the whole run on landing pages
Body copy on this ground — 13.04:1
The index plate, and the Brand practice dot
Black type on this fill — 6.81:1
Held in reserve — no consumer yet, but the safe value exists
On cream 5.74:1 · on off-white 6.06:1
A stop on four journeys, and where the homepage finishes
Body copy on this ground — 12.59:1
What the colour sits on
Off-white opens every journey. Cream is the second stop, the ground the deeper accents are tuned against, and the base every washed value is mixed into — which is why the figures above are quoted on it. Black is no longer a stop on anything: it arrives as the footer, and it inks every bright fill.
Opens every journey, and inks every dark surface outside one.
The second stop on every journey. The on-light accents are tuned against it.
No longer a stop on any journey. Inks every bright fill.
What every journey is written in, start to finish. A half-step softer than the page black.
The foreground on dark surfaces that sit outside a journey.
Pure black, edge to edge. The one surface on the site with no grain over it.
Sits behind every image while it loads, and stands in when there is none.
The mark as drawn. Chosen so inverting it lands on a legible off-white.
One file, flipped
There is no white version of the logo. A single dark master is inverted in the browser at the same moment the type flips, so the mark and the words it sits beside always change together. That is why the master is drawn in #171717 rather than black — it is the value that inverts to a legible #e8e8e8.
#171717 — 16.28:1 on off-white
#e8e8e8 — 15.65:1 on black
Follows the page as it changes colour, and holds light while the menu is open.
Where no journey runs, the mark is simply set light and left there.
Set to twice its own proportion so the lower half is cropped away. Decorative only: the studio is already named in the text above it.
One colour each
Every service carries a colour instead of a number. Three reuse a brand accent; one extends the set, because there are four services and only three accents. Each is shown on both grounds, because three of them share a hue with a stop on some journey and a mark has to stay visible when the page arrives at its own colour. On our washed green the bright Eucalypt dot reads 2.04:1 against the deeper one’s 4.59:1 — which is the whole argument for carrying two.
| Service | On dark | On light | Origin |
|---|---|---|---|
| Search & AI Visibility | #5fa98a | #2f6b52 | Eucalypt |
| Website Development | #b08eff | #5326b8 | Purple |
| AI Builds | #ffb545 | #8a4a00 | Extends the set |
| Brand | #ff5fa8 | #b31259 | Pink |
Where the pairs earn their keep
Each page runs its background through a set order of colours as you scroll. Drag the slider to read the background at any point in this page’s own run. The bars below are the real runs, with each colour pinned to the point it actually arrives. Watch the weight in the readout rather than the colour: it falls from 238 on cream to about 219 and then stays there, because every washed stop — and every point between two of them — carries the same weight.
The palette has moved twice, and this page moved with it
Our green used to be a bright lime. It was retired because it was a light colour wearing dark colour’s job: it filled beautifully and could not be read. Its replacement sits mid-way between light and dark, which meant the point at which the type flips had to move too — otherwise the green would have arrived carrying off-white type at 2.53:1, when black on the same green reads at 6.87:1.
Then the accents came off the backgrounds. Readers told us the site went dark as it scrolled, and they were right: a colour sized for a pill does not survive being stretched across a viewport, and the old stops dropped the page from 238 to as low as 143. The washed tier is the answer. It is one number rather than three tuned values because one number turned out to be enough — at 20% the three land 4 points apart, which nobody can see across a scroll.
None of the figures on this page are typed in. They are measured from the same values the site is built from, every time the page is published, so this page cannot quietly disagree with the thing it describes.