Branding · Guide

What goes into a brand style guide, and how to use one

Logo sizes for each platform, colour pairs that pass WCAG, font licences and Indian-script fonts, voice rules, a review checklist and a handover list.

Table of contents

A brand style guide (also called brand guidelines or a brand book) tells anyone making something for your business how to use your logo, colours, fonts, images and words, so the work looks and sounds like you without a call to check. It covers logo versions, colour codes, fonts, imagery, voice and templates. A useful one also records what people get stuck on: the sizes platforms show your logo at, which colour pairs are readable as text, each font's licence and where the files live. You use it by sending it with every brief and checking finished work against it.

What is a brand style guide?#

Identity work settles the logo, palette and fonts; the guide is the written half that travels with the files, so those decisions survive when a new freelancer, printer, developer or employee picks them up. Our piece on the difference between a logo and a brand identity explains where one ends and the other begins.

Test each page with one question: could someone follow it without asking you? "Use our blue" fails. "Use #1F3A5F for text on white" passes.

Where the 23% revenue figure comes from#

You may have read that consistent branding raises revenue by 23%. The figure comes from a 2016 survey report by Demand Metric and Lucidpress. Respondents who said off-brand material went out at least sometimes were asked to estimate how much revenue would rise if their brand were always consistent; answers ran from 5 to 50 percent and averaged 23. The survey had 234 qualified responses, mainly from B2B or mixed businesses, and its 23% is an average of guesses, not a measured result. We make no revenue claim for a guide. What we expect from one is fewer repeated questions and a standard to check work against.

Logo rules, and the sizes platforms show your logo at#

Show each approved version and when to use it: primary, stacked or compact, a square icon (the symbol or monogram alone), one-colour and reversed. Define clear space with part of the logo, such as the height of one letter, so it scales. Set a minimum size in millimetres for print and pixels for screens, and name the version that takes over below it. Show misuse as crossed-out pictures: stretched, recoloured, shadowed, on a busy photo. Our logo design service includes stacked and icon-only versions.

Where your logo appears online#

Most places that show your logo online use a small square, and Facebook crops it to a circle. These figures come from each platform's documentation, checked on 2 October 2026; they change, so date your copy too.

Logo and image sizes by platform, checked 2 October 2026
WhereWhat the platform asks for
Google Search faviconSquare, at least 8 x 8 px; larger than 48 x 48 px recommended
Google organisation logoAt least 112 x 112 px, and it should look right on pure white
Google Business ProfileLogo listed as a photo type; photos: 720 x 720 px recommended, 250 x 250 px minimum
Facebook PageCropped to a circle; shown at 176 x 176 px on computers, 196 x 196 px on smartphones and 36 x 36 px on most feature phones; upload 320 x 320 px
YouTube channelProfile picture renders at 98 x 98 px; banner at least 2048 x 1152 px, with text and logos inside 1235 x 338 px
LinkedIn PageLogo 400 x 400 px (268 x 268 px minimum), shown on light and dark backgrounds; a transparent logo sits on white
Links shared on FacebookAt least 1200 x 630 px, close to 1.91:1 so Feed does not crop it

So the guide needs a square icon that still reads inside a small circle, and logo versions tested on white and on dark, because LinkedIn and Google choose the background.

Set minimum sizes on a phone first#

In India, phones produced 77.91% of the page views StatCounter recorded in 2025, and desktops 21.55%.

Share of page views from India by device, 2019 to 2025

Share of page views from India by device, 2019 to 2025
PeriodMobile (%)Desktop (%)
201974.225.4
202069.530
20217623.6
202275.124.5
202376.423.2
202478.521
202577.921.6
Share of page views from people in India on the more than 1 million websites that run StatCounter's tracking code; tablets stayed under 1% every year. 2026 is left out because the year is not over. Source: StatCounter Global Stats, Desktop vs Mobile vs Tablet Market Share India, yearly.

Mobile's share has stayed between 69.54% and 78.47% in every year since 2019: about three page views in four. Check minimum logo and text sizes on a phone before you check them anywhere else.

Colour: exact values, print matches and contrast pairs#

List each colour in HEX and RGB for screens, CMYK for print and a Pantone reference for spot colours, with rough proportions, so nobody builds a poster out of the accent. Spot and process colours do not convert exactly: Pantone's Color Bridge guide calls its CMYK values the "closest" matches to its spot colours, and Pantone prints a separate edition on uncoated paper. Record the Pantone reference for each paper you print on, and ask for a printed proof before a large run.

Approved text and background pairs#

WCAG 2.2, the W3C's accessibility guidelines, asks for a contrast ratio of at least 4.5:1 between text and its background, and 3:1 for large text (about 24 px, or 18.5 px bold). Ratios are not rounded, so 4.499:1 fails. Text in a logo is exempt. W3C's explanation of the criterion adds:

"Beyond logos and logotypes, text that has insufficient contrast due to corporate identity or brand guidelines is not exempted from the requirements of this criterion."

W3C, Understanding Success Criterion 1.4.3: Contrast (Minimum)

Stand-alone icons, and the cues that show where buttons and form fields are, need 3:1 against neighbouring colours.

Most home pages miss the text rule. WebAIM's scan of the top one million home pages found low-contrast text on 83.9% of them in February 2026, more than any other issue it detected, with 34 instances per page on average.

Home pages with low-contrast text, 2019 to 2026

Home pages with low-contrast text, 2019 to 2026
PeriodValue (%)
201985.3
202086.3
202186.4
202283.9
202383.6
202481
202579.1
202683.9
Share of the top one million home pages where WebAIM's automated WAVE scan found text below the WCAG 2 AA contrast thresholds. The 2026 scan ran in February 2026; earlier years come from the same report's over-time table. Source: WebAIM, The WebAIM Million, 2026 report.

The share has not fallen below 79% in eight years of scans, and it rose again in 2026. Settle it once, in the guide: test each pair with a tool such as WebAIM's contrast checker and list the results.

Example pairs (sample colours, ratios from the WCAG 2.2 formula)
TextBackgroundRatioUse for
Navy #1F3A5FWhite #FFFFFF11.48:1Any text
Navy #1F3A5FOrange #F28C284.68:1Any text
Grey #777777White #FFFFFF4.48:1Large text and icons only
White #FFFFFFOrange #F28C282.45:1Never for text or icons

Never use colour as the only signal#

WCAG also says colour must not be the only visual means of conveying information. About 1 in 12 men have colour vision deficiency, according to the US National Eye Institute, and the most common type makes red and green hard to tell apart. Turn that into rules in the guide: mark errors with words or an icon as well as red, underline links in body text, label chart lines directly, and never show a sale price by colour alone.

Fonts: names, licences and fallbacks#

Name each typeface and weight, and set sizes for headings, body text and captions, with a minimum body size checked on a phone.

Write down each font's licence#

A font is software, and its licence decides where you may use it. In HTTP Archive's Web Almanac 2025, 64% of desktop pages and 65% of mobile pages used at least one font under the SIL Open Font License (OFL), and on roughly half of pages at least one font had a blank or unrecognised licence field. That does not make those fonts unlicensed: the licence field in the file was empty or not one the crawl recognised.

Font licences found on mobile web pages, 2025

Font licences found on mobile web pages, 2025
CategoryValue (%)
SIL Open Font License65
No licence named in the font file50
Font Awesome licence13
Apache licence8
Adobe Fonts licence4
Monotype licence4
Share of mobile pages using at least one font under each licence, read from licence metadata inside font files in the July 2025 crawl; a page can count in several rows. 'No licence named' means the field was blank or unrecognised, not that the font is unlicensed. Source: HTTP Archive, Web Almanac 2025, Fonts chapter.

Commercial licences are rarer: Adobe Fonts and Monotype licences each appear on about 4% of mobile pages. The OFL's FAQ says its fonts may be used in logos and other graphics, and that using one puts no restriction on the artwork made with it, but the repository behind Google Fonts still advises: "It is important to always read the license for every font that you use." Record each font's source, licence, licence holder and the uses it covers (print, web, apps, documents). Our full branding projects list each font with its licence source.

Name the fallbacks#

Not every computer or app has your fonts. Word and PowerPoint can embed fonts in a file, but Microsoft notes that font makers can mark a font as non-embeddable, preview and print only, editable or installable, so check the setting and name a system font for other apps. On the website, end the font stack with a generic family, as web.dev advises; sans-serif appears on about 89% of desktop and mobile pages. Swapping from a fallback to the web font can cause layout shifts, web.dev notes, and the CSS size-adjust descriptor helps reduce them. Our Core Web Vitals explainer covers why that matters.

Fonts for Hindi, Bengali and other Indian scripts#

A font chosen for English usually lacks Indian scripts. The Web Almanac found Devanagari, used for Hindi, in just under 1% of web fonts in 2025, and Gujarati, Gurmukhi and Tamil in under 0.1% each. If you publish in an Indian language, pick a matching font for each script and show the pairs in the guide. Poppins covers Devanagari and Latin, and Hind Siliguri, Anek Bangla and Noto Sans Bengali cover Bengali and Latin. Hind and Anek also come in matching versions for other Indian scripts.

Imagery and icons#

Describe the photos you want (subjects, light, colour treatment, crops) and whether stock is allowed. Pick one icon set, note its style (outlined or filled, line weight, corners) and show approved and rejected examples, since mixed sets look patched together. An icon that carries meaning on its own, such as a phone icon on a call button with no text label, needs 3:1 contrast too.

Voice and house writing rules#

"Friendly" and "professional" mean something different to every writer, so use pairs and examples. Mailchimp's published style guide lists four voice traits (plainspoken, genuine, translators and dry humour), limits one of them with pairs ("weird but not inappropriate, smart but not snobbish") and separates voice from tone: "You have the same voice all the time, but your tone changes." Write three to five traits, give each a "but not" limit, and add an example to follow and one to avoid:

  • We write: "Your order ships tomorrow. We'll email you the tracking link."
  • We don't write: "We are delighted to inform you that your order is currently being processed for dispatch."

Then set the house rules, starting with one exact form of your business name. Google Business Profile wants your real-world name as used consistently on your storefront, website and stationery. The name must not include taglines, ™ or ® signs, or words in full capitals (Google accepts KFC but not SUBWAY), and adding extra information can get a profile suspended. If your logo is in capitals, say the name is still written in normal case; our Google Business Profile guide covers the other name rules.

Add spelling (British or American), date format, prices (₹1,00,000 or ₹100,000), phone format and banned words. They matter most when others write for you, as in content creation.

Templates and finished examples#

Make templates for what you produce most, with the platform sizes built in, so people start from a correct file rather than a blank page:

Add letterhead, invoice, email signature, slides and post templates, then a page of finished examples, which answer questions the rules leave open. Whoever handles your graphic design or social media management works from these files.

How long should a brand style guide be?#

Published advice runs from 2 to 80 pages: Vistaprint says two to five can work well, a brand designer at Figma suggests keeping it to 25 to 35, and a creative director quoted by Shopify puts a full guide at 15 to 80. In our view, the number of people making things for you should decide:

How much guide you need (our recommendation, not survey data)
Who makes things for youWhat the guide needs
You and one freelancerQuick reference, logo, colour and font pages, two or three templates
A small team, an agency and a printerEvery section here, templates for each channel, the review checklist below
Several branches, resellers or franchiseesAll that, plus local variants, co-branding rules and an approval route

Whatever the size, open with a one-page quick reference: logo files, colour codes, font names and the folder link.

How to use a brand style guide day to day#

Brief with it#

Send each brief with the guide's link, the quick reference and the right template, and name the version ("guide v2.1, March 2026") so an outdated PDF stands out.

Check work against it#

Before you approve anything, check:

  1. Logo version, clear space and minimum size.
  2. Colour codes: HEX or RGB on screen, CMYK or Pantone in print.
  3. Text on an approved colour pair.
  4. Brand fonts and weights, or the named fallback.
  5. Photo style and the stock rules.
  6. Icons from the approved set.
  7. The business name in its house form, and ™ or ® only where allowed.
  8. The voice traits and house rules.
  9. Channel size, with text and logos inside the safe area.
  10. File format and name: vector (SVG, PDF or EPS) for print, SVG or PNG for logos on screens, JPG for photos.

One owner, one current version#

One owner approves exceptions and logs them; if people keep asking for the same exception, change the rule. Put a version and date on the cover, add a "what changed" note, replace the file at the same link rather than emailing it, and update the templates too. Review the guide when the logo, a colour or a font changes, when you add a channel, when a mistake keeps coming back and when a platform changes its sizes.

Brand style guide checklist: what your designer should hand over#

Ask whoever designs your identity for:

  • vector masters of every logo version (SVG, plus PDF or EPS)
  • transparent PNGs at your platform sizes, including the square icon
  • reversed and one-colour versions, tested on white and on dark
  • HEX, RGB, CMYK and Pantone values for every colour
  • font names, sources and licence details
  • editable templates, and the guide as a PDF plus its source file
  • a written copyright assignment for the logo and artwork

In India, the last item is what makes the transfer valid. Under the Copyright Act, 1957, the author of a work is generally its first owner (section 17), with exceptions such as work an employee makes on the job. Section 19 makes an assignment valid only in writing, signed by the assignor. It must identify the work and state the rights, duration, territory and payment; if it states no period, the law assumes five years, and if no territory, India. Rights you do not use within a year of the assignment lapse unless it says otherwise. Have a lawyer check the wording. In our brand identity design projects, the files, guidelines and ownership pass to the client on full payment.

Mistakes to avoid#

  • A voice described only in adjectives.
  • No list of approved text colour pairs.
  • No square icon, so circle crops cut the wordmark.
  • Fonts with no licence record or fallback.
  • The guide emailed as an attachment, so old copies circulate.
  • A polished PDF with no templates.
  • Platform sizes copied from old articles, not the platforms' own pages.

Where to start this week#

  1. Collect your best logo files, vector first, and check you have a square icon and a reversed version.
  2. List your colours in all four formats and test every text pair.
  3. List your fonts with their sources and licences.
  4. Write three to five voice traits, each with a "we write, we don't write" pair.
  5. Make templates for the two or three things you produce most.
  6. Put everything behind one link, with a version number and date on the cover.

If step one turns up missing logo versions, fix those first, and talk to us about your guide if you want help. There is more in our branding articles.

Add N&D Co. as a preferred source on Google

Have a question about your own business?

Send a few lines about your business and what you are trying to fix. We will reply with questions or a quote.

Get in touch