Your logo’s smallest appearance is also its most frequent one. A favicon is 16 pixels square in a browser tab, and it sits there through every visit, next to a dozen other tabs competing for the same glance. Most logos are never tested at that size until the site is being built, and by then the answer is whatever the developer could crop out of the file they were sent.
What 16 pixels actually takes away
At favicon size you have roughly 256 pixels to say something with. Thin strokes disappear into the background. Gaps between shapes close up. Anything with more than two or three distinct parts turns into a smudge with a color. This is not a rendering problem you can fix with a better export; it is the size.
16px
The practical test is simple and worth doing before you approve any logo: shrink it to the size of a fingernail and look at it from arm’s length. If you can still tell it apart from the logo next to it, it will survive a browser tab.
The wordmark goes first
Company names are the usual casualty. Text needs far more room to stay legible than a shape does, so a lockup that reads perfectly on a business card becomes a gray blur at icon sizes. What you want at that point is a second version of the logo with the name dropped entirely, leaving just the symbol.
Our own guidelines put numbers on this. The mark alone is never used below 24 pixels, and the horizontal lockup with the wordmark attached is never used below 120 pixels wide. Below that, the rule is to switch lockups rather than scale the same one down. That decision gets made once, written down, and then nobody has to relitigate it at build time.
Contrast decides whether the shape survives
A mark can be the right shape and still vanish, because the color carrying that shape is too close to whatever is behind it. Our brand accent is a bright cyan, and when we measured it against light backgrounds it came in between 1.6 and 2.6 to 1, well under any readability threshold. So cyan is an accent color in our system and never carries text or a critical edge on a light surface; the charcoal part of the mark does the structural work, and the cyan sits on top of it.
The same measurement in reverse is why a second version exists for dark backgrounds. On our dark surface the light cyan measures 8.2 to 1, so it is free to do more there. Browser tabs, phone home screens, and profile pages are not all one color, and a single icon file cannot look right on all of them.
What you should actually receive
Working at small sizes means shipping a set of files rather than one. Here is the set this site runs on, every one of them shown at the size it is actually used:
16px
browser tab
32px
tab on a retina screen
48px
bookmarks bar, .ico
180px
iOS home screen
Each one is generated from the vector masters rather than resized from the last export, which is how they stay sharp instead of getting progressively mushier. Square avatars for the profile pages we keep come out of the same masters.
If your current logo only exists as one large image, that is the gap worth closing first. It is also the point where a brand system stops being a design exercise and starts being something whoever builds your site can implement without guessing.