How we picked a mark that survives 32 pixels

A logo is mostly seen small

Nearly every time somebody sees your mark, it is tiny. A browser tab gives it 16 or 32 pixels. So does a chat avatar, a calendar invitation, a phone home screen, and the little square beside a search result. The version on the poster is the one you spend the week on. The version in the tab is the one people actually look at, several hundred times.

We had a mark already, drawn for the design system and locked there. Before we built this site we wanted to know whether it was the right one, or just the one that happened to be first. So we drew five alternatives and set up a test that could not be argued with.

The test is not taste. Taste is a conversation with no end. The test is a render.

The bench: three renders each

Every candidate was drawn once, on a 100 by 100 grid, and then rendered three ways.

Large. The poster version, where every idea looks fine.

32 pixels. The tab. At this size one unit of the drawing is 0.32 of a pixel, so anything the designer drew thinner than about five units is not going to be there.

One colour. Fill the whole shape in a single ink. This is the version that goes on an invoice, a laser-etched panel, a stamp, and any surface that cannot hold two colours. Any part of a mark that exists only because of a second colour disappears here.

Figure 2 is the bench itself. The shapes below are the same drawings the test used, rendered by your browser at those three sizes. Nothing is a screenshot, so you can zoom the page and watch what happens.

What broke, and why

Every failure below is arithmetic on the drawing, not an opinion. Multiply a measurement in grid units by 0.32 to get pixels at tab size.

C, the nested outlines, fell apart first. Its outer letter is drawn with a 5-unit stroke, which is 1.6 pixels. The middle copy is scaled to 62 per cent, so its stroke is 0.99 of a pixel. The innermost letter is 6 pixels tall. At tab size the three of them close up into a dark rectangle. The idea was version on version on version, and it needed 200 pixels to say so.

D and F failed the ink test, not the size test. Both are perfectly readable at 32 pixels. But D's dot is a hole in a triangle and F's letter is a gap cut out of a disc, so both are drawn in the background rather than in the ink. Fill either one in a single colour and you get a plain triangle and a plain circle. A mark you cannot stamp is only half a mark.

B survived the bench and lost on a different ground. Three stacked rounded squares, 2.24-pixel strokes with 3.5-pixel gaps, and it holds together. It is also close enough to the mark another company in this market already uses that people would read it as theirs. That is a good reason to stop, and it has nothing to do with rendering.

The one that came closest

E is a letter N built out of sixteen rounded blocks: two upright columns and a staircase between them. It is meant to read as a stack of samples in a scanned volume, which is what our data actually is.³

It passes the ink test outright, because there is nothing in it but ink. At 32 pixels each block is 3.97 pixels across, which is plenty. It was the only alternative to survive both parts of the bench.

It is also the one place where the arithmetic told us something the eye missed. The gaps between the blocks are 2 units, which is 0.64 of a pixel. At tab size those gaps are thinner than a pixel, so the blocks blur into two soft bars and a soft diagonal. The letter still reads. The idea, the one about samples in a stack, quietly stops being visible at exactly the size where most people meet the mark.

So the honest verdict is that E is a good drawing whose meaning does not survive the trip. It came closest, and closest was not enough to move a locked mark.

What we changed instead

The mark stayed. Its strokes are 8.7 to 10.4 pixels wide at tab size, it has no second colour anywhere in it, and it is not anybody else's shape. Six drawings and an afternoon confirmed that the incumbent was fine, which is a boring outcome and the right one.

Two things did change.

It is drawn in the current text colour, everywhere. Every place the mark appears on this site it inherits the colour of the text around it, so it works on the dark page, on the tan band and on paper without a second file existing.

We stopped asking whether it means anything. Marks do not carry meaning on their own. They collect it from whatever the company turns out to be. Ours is three strokes that read as an N and stay legible in a tab. That is the whole specification, and it is enough.

If you want the part of this site where the meaning actually lives, it is the record under every label: who drew it, who checked it, and what changed.