A lot of logo projects end with a zip file: the logo as one large image, maybe a vector, and three hex codes pasted into an email. Six months later someone asks which version goes on the dark footer, or whether the light blue can be used for links, and nobody knows. A brand guide is the document that already answered. Here is what belongs in one, with the guide we keep for our own brand as the example.
Every version of the logo, and where each one goes
One logo file isn’t enough, because the places a logo lands are different shapes. Our guide names six lockups: the mark alone, the mark beside the wordmark, and the mark stacked above it, each in a light version and a reversed one for dark backgrounds. Each comes with its job. The horizontal lockup goes in site and email headers, the stacked one in square spaces, and the mark alone on favicons and profile pictures.
Then come the rules that keep it from being mangled. Clear space is measured from the logo itself: our mark is a cube, and the margin around any lockup equals the height of its top face, so the space scales with the logo. Minimum sizes are given in pixels, 24 for the mark and 120 wide for the horizontal version, and below that you switch to the mark. Last is a do-not list. Don’t recolor it, stretch it, add a shadow, retype the wordmark, or set it on a busy photo without a solid panel behind it. A list like that feels fussy until someone recolors the logo to match a flyer.
Colors with names, jobs, and numbers
In a guide, every color gets a name, its values, and a job. Ours has a cyan for the signature accent, a charcoal for text, an off-white for text on dark grounds, and a pale grey for page backgrounds.
The part most guides skip is measurement. We measured our colors against the WCAG contrast thresholds, and our own cyan failed on white, landing under 3 to 1 where body text needs 4.5. So the guide says it outright: on light backgrounds, cyan is a fill, a border, or an icon, never text. On the charcoal it passes, so there it can be. Leave that unwritten and sooner or later someone sets a link in the brand color because it looks on brand, and readers with weaker eyesight can’t make it out.
The guide also keeps brand colors out of status messages. Errors get their own red and success its own green, and the cyan never means something went wrong. It takes one sentence to write down, and the question comes up every time someone builds a form.
Type, spacing, and the photos
Typography means a typeface and a scale: which face, which weights, and a size for body text and for each heading level. Ours sets body copy at 18 pixels with a floor of 14 that nothing drops below. Spacing gets the same treatment, a base unit and the steps built from it, plus corner radii and the rule for borders. Written as tokens, these are values a developer can put straight into a stylesheet, so the site is built from the guide rather than from a screenshot of it.
Photography belongs in the guide too, even if you never hire a photographer. Ours says which subjects fit and how photos are toned and framed, and it lists what never appears: faces, readable text, other companies’ logos. That last list is what a stock photo or a generated image gets checked against before it goes on the site.
Keep it current
The last thing a guide needs is a date on every decision. Ours was ratified on one day, gained an alternate accent color the next, and added more dark-mode colors less than three weeks after that, and each change went in with the date it was agreed, so nobody has to wonder whether a rule still stands. A PDF exported at the end of a logo project can’t do that, and it is usually stale by the time the website changes.
If you are paying for a logo, ask whether a guide comes with it, and look for the lockups, the measured palette, the scales, and the do-not list. All of that is part of a logo and brand system at our shop. The small-size rules, which decide whether a logo still works at favicon size, have a post of their own.