Crossfire Neon · identity sheet
Everything here is hand-authored SVG. Switch palette and mode with the bar above — the mark has to hold on all six, because a theme logo ships as a data URL and a data URL cannot read the page's CSS.
Three routes drawn far enough to judge, then compared at 48px and 24px before any refinement started.
Won. One length of glass, one bend, two sealed ends — which is exactly what a neon unit is. It is also a letterform, so it carries the shop name without a wordmark propping it up.
Rejected. Named the thing exactly — a crossfire is
the twin-jet burner tube is bent in — and then read as a generic X at every
size. Nothing in it says glass. Two attempts to fold it into A followed,
and both failed — see A2 and A3. It ended up as the block family's divider,
favTubeCrossfire, which is where it belongs.
Rejected as the mark, kept as the theme. The gridded
bending pattern the tube is drawn on first. Too much information inside a
container at 24px — the grid turns to grey. It became the framing device for
the whole favTube block family instead, where it has room.
Four passes. Each one fixes something the previous one measurably got wrong, not something that felt off.
A C with two straight stubs. Legible, and it could be any business beginning with C. The electrodes read as serifs.
The idea arrives, and brings a new problem: the tails cross inside the mouth of the C and seal it. Uniform stroke too, so on a black ground this is a mid-grey shape on a dark field — 1.9:1.
Split into two layers — mid-slate glass that holds on paper, bright core that holds on black. Both always drawn, so neither mode needs a different file. But printed at 48px it reads as a ring with a knot on it, not a C: the counter is closed and the letter is gone.
Shipped. The crossing is abandoned, not rescued — two passes of moving it around proved the problem was the idea, not the placement. The tails now diverge to opposite corners, which reopens the counter and turns them into what they always were: two electrodes at the two ends of one tube. Nudged 1.9 units left so the optical centre lands on the bowl rather than the tails. Each end gets a glass shoulder and a hot pin, and a soft bloom sits under everything — the light the glass throws, which on a dark ground does most of the work.
Header and letterhead. The wordmark is a condensed
websafe stack with textLength locked, because a data URL cannot
load the theme's Google face — locking the width means the lockup keeps its
proportions whichever fallback the machine resolves.
Mobile chrome and anything square. The mark is scaled 1.35× rather than reused at size — at this width the wordmark is the shorter element, and an unscaled mark reads as a hat.
Alone. Size test below — 24px is the bar and it clears it.
One value — the mid-slate, which clears 3:1 on both the lightest paper (5.5:1) and the darkest ground (3.15:1) in the theme, so it needs no light/dark pair. The crossing merges; a stamp or a vinyl cut of this mark does the same.
On a saturated field the mid-slate glass dies — mid-tone on mid-tone. So the layer logic inverts rather than the colours: glass becomes white at 55%, core becomes solid white, bloom is dropped. Change palette above and watch it hold on all three brand colours.
A redraw. The crossing collapses to one hot node — two tubes passing is four stroke edges inside five device pixels and fills in. Stroke is 2.2× heavier proportionally, and the ink tile makes the background known so it holds in any browser chrome.
The mark at the sizes it actually has to survive. 24px is the bar for the icon; 32px and 16px for the favicon.
The mark carries its own colour, so this is the real test: it never asks the page what palette is running. Switch palette and mode above and check all four.
Files: logo/primary.svg · logo/stacked.svg ·
logo/mark.svg · logo/mono.svg ·
logo/reversed.svg · logo/favicon.svg.
The primary lockup is the one encoded into THEME.json.