Identity sheet

Three concepts, four passes, six variants.

Colour approach: a self-sufficient gradient. A theme logo ships as a data URL, and a data URL cannot read page CSS — so currentColor works in this HTML but not once the mark is inlined into windchest.ts. Rather than ship a mark that only reads on one palette, every shipping variant carries its own pewter → brass gradient. Both ends are mid-tones (3.9:1 and 3.1:1 against the lightest background in the theme, 4.3:1 and 5.5:1 against the darkest), so the mark holds on all six palettes without knowing which one it is standing on.

Step one

Three concepts for the icon mark

Drawn to the same 32-unit grid, looked at side by side at the size they would actually be used.

A · The rank Pipes in a row. The most recognisable image the trade has, and it survives to any size. Taken forward — but it is a bar chart

B · The mouth One pipe mouth, very close. The strongest single form in the theme's vocabulary — and at 24px it is a rectangle with a triangle in it, which is a play button. Rejected — reads as a media control

C · The drawknob The engraved stop face. Handsome, and it earns its place — but as a circle-with-a-stem it is a generic roundel, and Counsel already owns the roundel in this catalogue. Rejected as a mark — kept as the favRankStops device

Step two

Four passes on concept A

Each pass fixes exactly one thing the previous one got wrong. All four are rendered at 96px and again at 24px, because the 24px view is the one that decided each move.

A1 Five bars, equal width, monotonic descent. No pipe-ness at all. Problem: a bar chart

A2 Feet tapered, mouth notches cut. Now unmistakably pipes. Problem: five feet clog below 32px

A3 Down to three pipes; the languid rule and the chest bar added, which gives the mark a horizontal and a base. Problem: still descends left to right

A4 — final Heights re-ordered tall · short · mid. A real case front is mitred, not stepped, and the asymmetry is what finally stops the eye reading data. Gradient applied. Shipped

A1 · 24px

A2 · 24px

A3 · 24px

A4 · 24px

Step three

The suite

1 · Primary lockupMark, wordmark and descriptor, horizontal. The default header mark. Wordmark letter-spacing is opened to 4.2 so its rhythm matches the gaps between the pipes.

2 · Stacked lockupNarrow chrome and the mobile header. The descriptor is dropped rather than shrunk.

3 · Icon markStandalone. Tested at 24px below.

4 · MonochromeUses currentColor, so it inherits the palette's ink here. It cannot ship in the theme file for exactly that reason — this variant is for print, stamps and one-colour work.

5 · ReversedSolid white on brand-coloured and photographic fields. The languid rule is thickened from 1.3 to 1.6 because a knocked-out hairline optically thins.

64px

32px

16px

6 · FaviconA simplification, not the mark shrunk: two pipes instead of three, bodies 50% wider, mouth notches and languid rule removed. What survives at 32px is the silhouette.

Step four

The 24px test

The icon mark stepped down. Below 20px the mouth notches close up and the mark becomes the favicon's job — which is why the favicon exists as a separate drawing.

96px

48px

32px

24px — the bar

16px — use the favicon

Step five

The same mark on all six palettes

Each tile carries a palette locally, so this is the real thing — the shipped gradient lockup standing on every background the theme can produce, in both modes, with no CSS reaching it.

Light 1 · Spotted Metal

Light 2 · Oak & Verdigris

Light 3 · Nave Slate

Dark 1 · Spotted Metal

Dark 2 · Oak & Verdigris

Dark 3 · Nave Slate