Brand spec

Generated by brand/spec.py from brand/mark.py. Every image is the shipped file itself and every ratio is computed, so this page cannot describe a logo the site does not have.

01 · The mark

The finder. The two corner brackets of the home page's search console — top-left and bottom-right, square-cut, with the console's rounded joint — hold a white four-point star on a dark tile. The brackets find; the star is what they find: the one tool you came for. It is drawn out of the page's own instrument panel — the console's surface, its 26 % accent hairline for an edge, its corners — so the logo and the site are one design.

It survives 16 px on contrast alone: on the tile's lightest stop the brackets measure 9.1:1 and the star 16.0:1.

02 · Construction

A 32-unit square, tile corner radius 7, point-symmetric about (16, 16).

Brackets: centreline corner 6.6 in from each edge, arms 7.6, joint radius 2.2, stroke 3, butt ends.
Star: tips at radius 6.8, inner vertices at 2.2 on the diagonals, straight sides.
Edge: 0.5-unit hairline in the accent at 42 %.
Maskable icon: the glyph at 84 % reaches 11.7 units from the centre, inside the 12.8-unit safe circle.

geometry maskable safe circle

03 · Clear space

One quarter of the tile — 8 of its 32 units — on all four sides. Nothing enters that box. For the lockup, the same distance measured from the tile.

04 · Minimum size

Use	Minimum	File
Mark, screen	16 px (the favicon)	`favicon.svg` / `favicon.ico`
Mark, print	8 mm	`logo-mark-mono-dark.svg`
Lockup, screen	180 px wide	`logo-lockup-dark.svg` / `-light.svg`
Lockup, print	32 mm wide	the same

05 · One colour

Where the tile cannot go — one-colour print, embossing, a partner's layout — the glyph stands alone in one colour. Nothing is knocked out, so the reduction is the primary glyph exactly.

06 · Colour

#17232e
tile, top

#0a1016
tile, bottom

#2dd4ff
accent — brackets, edge, fills

#ffffff
the star; mono on dark

#071019
ink — mono on light, text on light

#0a0f14
page background

#e6faff
wordmark on dark

#0a7ea4
accent for text on light

The accent #2dd4ff is for fills and rules. As text on white it is 1.75:1, so accent words on light surfaces use #0a7ea4 (4.63:1, WCAG AA). The previous spec's #1aa3cc was 2.94:1 and never passed; gen_assets.py now refuses to run below 4.5:1.

07 · Lockups

Mark, a hairline, and the wordmark on two lines — THE MOST USEFUL / SITE IN THE WORLD, Inter 800 in caps with +0.14em tracking, USEFUL in the accent. The files carry the wordmark as outlines of the site's own Inter, never live text. The home page's hero and footer set the same lockup in HTML.

08 · Files

File	What it is
`logo-mark.svg` / `favicon.svg`	the mark — one file, two names (pages link the first, browsers look for the second)
`favicon.ico`	16 / 32 / 48 px, each rendered at its own size
`icon-192.png`, `icon-512.png`	PWA and Android "any" icons: the rounded tile
`icon-maskable-512.png`	full-bleed surface, glyph at 84 % inside the safe circle
`apple-touch-icon.png`	180 px, opaque and full-bleed (iOS rounds the corners itself)
`logo-mark-mono-dark.svg` / `-light.svg`	one colour, `#071019` for light surfaces / `#ffffff` for dark
`logo-lockup-dark.svg` / `-light.svg`	the lockup, wordmark as outlines
`og-brand.png` / `og-tools.png`	the 1200×630 social card; its headline is the home page's <h1>
`logo.png`	1024² stacked lockup, for press and directories

09 · What not to do

Don't recolour the brackets or the tile, and don't bring back a bright gradient tile: the mark belongs to a dark instrument panel.

Don't rotate or mirror it. The brackets sit top-left and bottom-right, exactly as on the search console.

Don't add a glow, gloss, bevel, shadow or outline. The page's chrome is flat hairlines, and so is the mark.

Don't put the glyph without its tile on a mid-tone. Use the tile, or a one-colour reduction on a plain surface.

Don't add a tool count or a tagline to a lockup: counts live in one generated place and cannot be re-derived inside an image.

Do use the mark on its own at 16 px and up, with its clear space, and nothing else in the tile.

10 · Changing it

Edit the numbers in brand/mark.py, then (packages in brand/README.md, installed outside the repository):

`/tmp/brandenv/bin/python brand/gen_assets.py`	rewrites every asset from the SVG, vector and raster
`python3 brand/spec.py`	regenerates this page
`python3 brand/check-mark.py`	proves every shipped file is still mark.py's drawing (also in `verify.sh --deep`)

Nothing else in the repository knows what the logo looks like.