Shopify guideGuide·10 min read
How to Build a Brand Style Guide for Your Store (With Template)
A brand style guide stops your store looking like five different brands. Here's the one-page template I use, and how to put every rule into Shopify.

Key takeaways
- A brand style guide is a short rulebook for how your store looks and sounds: logo use, colors, fonts, voice, imagery and the words you always or never use.
- For most Shopify stores, a one-page version is enough to start. It should fit on a single screen and answer the questions your team, designers and freelancers ask most.
- Shopify can store part of the guide for you: logos, brand colors, an 80-character slogan and a 150-character description under
Settings > General > Brand assets. - Check every text and background color pair against the WCAG minimum of 4.5:1 before you lock the palette in, or your theme will fight your brand on every page.
- Who it is for
- Store owners building or tidying a brand
- Time needed
- An afternoon for the one-page version
- What you need
- Your logo files and current store
Most of the stores I'm asked to fix don't have a design problem. They have a consistency problem. The homepage uses one shade of green, the product pages use another, the emails use a third, and the Instagram posts use whatever the freelancer had open that week. Shoppers can't name what's wrong, but the store feels less trustworthy than it should.
A brand style guide fixes that, and it doesn't need to be a 60-page agency PDF. This guide walks through what goes into one, how I build one with store owners in an afternoon, and exactly where each rule lives inside Shopify so the theme, checkout and emails actually follow it. Shopify features and limits below come from Shopify's Help Center, as checked on 7 November 2026.
What a brand style guide is, and what it isn't
A brand style guide is a reference document that records the decisions behind your brand's look and voice, so anyone who touches the store makes the same choices you would. It covers visual rules (logo, color, typography, imagery) and verbal rules (tone, vocabulary, formatting).
It isn't a brand strategy. Your positioning, audience and story come first, and the style guide turns them into rules. If you haven't written your story yet, do that before you pick fonts. My guide on writing an About page that builds trust covers the raw material you'll need.
It also isn't a mood board. A mood board shows what you like. A style guide says what to do: "Use Forest Green #1F4D3A for buttons, never for body text."
The one-page brand style guide template
Start here. Fill in each row, and you have a working guide that a designer, a copywriter or your future self can follow. Add detail only when someone gets a decision wrong.
| Section | What to record | Example entry |
|---|---|---|
| Logo | Versions, minimum size, clear space | Full logo above 120px wide, icon below |
| Colors | Hex codes and the job of each | #1F4D3A buttons, #F6F1E7 backgrounds |
| Typography | Heading font, body font, sizes | Headings serif, body sans at 16px |
| Voice | Three traits, with "not" partners | Warm, not gushing |
| Vocabulary | Words you use and avoid | "Refill", never "cheap" |
| Imagery | Lighting, backgrounds, crops | Daylight, linen backdrop, square crop |
| Formatting | Prices, dates, capitalization | Sentence case headings, $24 not $24.00 |
How to create a brand style guide in seven steps
This is the order I use with store owners. Each step takes 20 to 40 minutes if you've already written down who you sell to.
- Audit what you already have. Screenshot your homepage, a product page, the cart, an order confirmation email and your last five social posts. Lay them side by side and circle every inconsistency: colors, fonts, button styles, tone.
- Pick the version you'll keep. For each inconsistency, choose one winner. Usually it's the one on your best-selling product page, because customers already know it.
- Lock the logo rules. Decide which logo version goes where (full, stacked, icon), the minimum size, and what it may sit on. Export clean PNG files at the sizes Shopify asks for.
- Build the palette. Choose one primary color, one or two accents, a background and a text color. Give each a job, then test the contrast of every text and background pair.
- Choose two fonts. One for headings and one for body text is plenty. Make sure both are available in your theme's font picker, or budget for adding a custom font.
- Write the voice rules. Pick three traits and pair each with what it is not. Then write two or three "write this, not that" examples for each.
- Set the image rules. Record lighting, background, angle, crop ratio and whether people appear. Attach three photos that get it right.
Logo and color rules that survive real use
Logos break in predictable places: a dark footer, a small mobile header, a square social avatar, a favicon. Record a version for each. Shopify stores two logo types in brand assets: a default logo, which must be at least 512 pixels wide, and a square logo, where Shopify recommends at least 512 x 512 pixels. Both accept PNG or JPEG.
For color, the rule that matters most is contrast. WCAG 2.2, the accessibility standard most stores are measured against, sets a minimum contrast ratio of 4.5:1 for normal text and 3:1 for large text, which it defines as at least 18 point, or 14 point bold. Pale gray body text on a cream background is the most common failure I see on new brands. It looks soft in a mockup and unreadable on a phone in daylight.
| Color role | Used for | Rule |
|---|---|---|
| Primary | Buttons, links, key highlights | Must pass 4.5:1 with button text |
| Accent | Badges, sale tags, icons | Use sparingly, never for body text |
| Background | Page and section fills | One main, one alternate at most |
| Text | Body copy and headings | Near-black, not mid-gray |
| Feedback | Errors and success messages | Red and green that pass contrast |
Typography: two fonts and a size scale
Record the font names, the weights you use and a size scale. A simple scale might be 16px body, 20px for subheadings, 28px for section titles and 40px for page titles on desktop, scaled down on mobile. Most Shopify themes let you set heading and body fonts, plus a font size scale, in the theme's Typography settings.
Two rules save the most trouble. Never set body text below 16px on mobile, and never use your display font for paragraphs. Decorative fonts work for a headline of five words, not for a returns policy.
Voice and copy rules, with examples
Voice is the part of a style guide that most stores skip and most need. It decides how product descriptions, emails, error messages and support replies sound. The quickest way to define it is to place your brand on two scales.
Where does your voice sit?
- Formal, seriousExpertPrecise and calm. Suits supplements, B2B parts and anything regulated.
- Formal, playfulWitty hostPolished with a light touch. Suits gifts, gin and premium food.
- Casual, seriousTrusted friendPlain and honest. Suits skincare, baby products and wellness.
- Casual, playfulHype crewShort, loud, fun. Suits streetwear, snacks and toys.
Then write paired examples. These are the entries that make a style guide useful, because a writer can copy the pattern.
| Moment | Write this | Not this |
|---|---|---|
| Add to cart | Add to bag | Purchase now |
| Out of stock | Back on 12 May. Want a reminder? | Item unavailable |
| Shipping note | Free delivery over $50 | Complimentary shipping on qualifying orders |
| Error | That code has expired. Try WELCOME10. | Invalid discount code |
Photography and product images
Image rules keep a catalog looking like one store when photos come from different shoots, suppliers or user content. Record the background (pure white, a set color, or a lifestyle scene), the lighting, the main angle, the crop ratio, and how many images each product needs.
The crop ratio matters most on Shopify, because collection grids look broken when one product is square and the next is portrait. Pick one ratio, usually square or 4:5, and set your theme's product card image ratio to match.
Put the guide into Shopify
A style guide only works if the store enforces it. Here's where each rule goes, using current Shopify admin paths.
- Brand assets. Go to
Settings > General, then click Manage in the Brand assets section. Add your default and square logos, primary and secondary colors, a cover image (Shopify recommends at least 1920 x 1080 pixels), a slogan of up to 80 characters and a short description of up to 150 characters. Compatible themes and apps pull these in automatically. Note that brand assets can't be localized by market or language. - Theme colors and fonts. Go to
Online Store, click Edit theme, then open Theme settings (the gear icon). Set colors and typography there. Many themes use color schemes, groups of background, text and button colors you apply to sections, and allow up to 21 of them. Newer themes such as Horizon 4.0.0 and later use named color palettes instead, which update everywhere when you change one. - Logo in the theme. In the same Theme settings, open Logo to set the header logo, its alt text and desktop width.
- Checkout and customer accounts. Go to
Settings > Checkoutand open the checkout and accounts editor, which Shopify includes from the Basic plan up. Set the logo, colors and fonts so checkout matches the store. Deeper styling through the Checkout Branding API is limited to Shopify Plus. - Notification emails. Go to
Settings > Notificationsand add your logo and accent color to the email templates, so order confirmations look like your brand. - Custom CSS, sparingly. Themes include a Custom CSS setting. Use it for small fixes only. If you need a lot of it, your theme isn't the right base, and a Shopify developer should change the theme properly instead.
If you're still choosing a theme, read Dawn vs premium Shopify themes first. How many color and font controls a theme offers decides how much of your guide you can apply without code.
Brand style guide examples, by store type
These are illustrative entries I've written to show the level of detail that helps. They aren't real brands.
- A candle brand. Voice: warm, not sentimental. Colors: ink #22201C text, wax #F4EFE6 background, ember #B4532A buttons. Images: low evening light, one candle per frame, no stock flames. Words: "burn time", never "lasts forever".
- A supplements store. Voice: precise, not clinical. Rule: every benefit line links to the ingredient it comes from. Formatting: doses always as "500 mg", with a space. Images: white background for packshots, real people for lifestyle, no lab coats.
- A B2B parts supplier. Voice: expert, not stiff. Rule: part numbers go in the first line of every product title. Colors: navy for trust, one safety orange for stock alerts only.
Common mistakes
- Too many colors. More than five roles and nobody remembers which is which. Cut until each color has one job.
- No contrast check. A palette that fails 4.5:1 can't be fixed later without changing the brand.
- Voice traits with no examples. "Friendly" means something different to every writer. Paired examples remove the guesswork.
- Rules the theme can't follow. Picking a font your theme doesn't offer means custom code on every update.
- Forgetting checkout and email. Shoppers notice when the brand disappears at the moment they pay.
- Writing it once. Review the guide every six months, or whenever you add a channel.
Brand style guide checklist
- Logo versions exported: full, icon, light and dark, at 512px or larger.
- Palette of five roles or fewer, with hex codes and a job for each.
- Every text and background pair passes 4.5:1, or 3:1 for large text.
- Two fonts, a size scale, and a 16px minimum for body text on mobile.
- Three voice traits, each with a "not" partner and two examples.
- A vocabulary list of words to use and avoid.
- Image rules: background, light, angle, crop ratio, images per product.
- Brand assets saved in
Settings > General. - Theme colors, fonts and logo set in Theme settings.
- Checkout and notification emails branded to match.
Next steps
Block out an afternoon, fill in the one-page template, and apply it in Shopify the same day while the decisions are fresh. Then look at your store on a phone and check that the homepage, a product page, checkout and the confirmation email all feel like one brand. If they don't, or if your theme won't bend to the guide, I'm happy to review your store for free and tell you what to change first.
Free tools
Check your own store
Free, no sign-up. Each one runs a part of this guide for you.
Frequently asked questions
What is a brand style guide?
A brand style guide is a reference document that records how your brand looks and sounds: logo use, colors, fonts, imagery, voice and vocabulary. It lets anyone who works on your store make the same choices you would, so the site, emails and social posts stay consistent.
What should a brand style guide include?
At minimum: logo versions and sizes, a color palette with hex codes and a job for each color, two fonts with a size scale, three voice traits with examples, a vocabulary list, and image rules. Larger brands add packaging, social templates and accessibility rules.
Can a brand style guide be one page?
Yes, and for most small stores it should start that way. A one-page guide that people actually read beats a long PDF nobody opens. Add sections only when someone keeps getting a decision wrong.
Where do I add brand colors and logos in Shopify?
Go to Settings, then General, and click Manage in the Brand assets section to add logos, colors, a slogan and a short description. Then set theme colors, fonts and the header logo under Online Store, Edit theme, Theme settings.
How do I make sure my brand colors are accessible?
Check each text and background pair with a contrast checker. WCAG 2.2 asks for at least 4.5:1 for normal text and 3:1 for large text. If your favorite color fails, keep it for accents and use a darker shade for buttons and text.
How often should I update my brand style guide?
Review it every six months, and whenever you add a channel, change your theme or launch a new product line. Update the guide first, then the store, so the two never drift apart.
Sources
- Managing brand assets, Shopify Help Center
- Theme settings, Shopify Help Center
- Checkout extensibility, Shopify Help Center
- Understanding Success Criterion 1.4.3: Contrast (Minimum), W3C
Related services and work

Written by Ashraf Siddik
I'm a Shopify developer and CRO specialist. I have built and improved Shopify stores since 2018, completed more than 1,000 projects, and hold a 4.96 average rating across 719 client reviews.
More guides
-
CRO8 min readUpdated
Why Shopify Stores Lose Sales on Mobile: A Practical CRO Checklist
Mobile visitors decide fast, with one thumb and plenty of distractions. Here is how to find the leaks on a Shopify store and fix them in the right order.
Read the guide -
CRO6 min readUpdated
Shopify CRO Audit Checklist for DTC Brands
The checklist I use to audit DTC Shopify stores, from checking that the data can be trusted to deciding which fixes to ship first.
Read the guide -
Apps6 min readUpdated
When to Build a Custom Shopify App Instead of Adding Another Subscription
Another subscription is the quickest fix, until you are paying for five apps that still don't match how your business works. Here is how to decide.
Read the guide -
Themes6 min readUpdated
How to Find Out What Theme a Shopify Store Uses
Every Shopify store names its theme in the page code. Here is where to look, how to read what you find, and what it means for your own theme choice.
Read the guide -
Apps5 min readUpdated
How to See What Apps a Shopify Store Uses
Apps leave traces in a store's page code: scripts from their own servers, app embed folders and pixel settings. Here is how to read them, and what to do with the list.
Read the guide -
Branding7 min readUpdated
How to Name a Shopify Store (and Check the Name Is Free)
A store name has to be easy to say, free as a domain and a handle, and clear of other brands. Here is the process I use with clients, and what Shopify lets you change later.
Read the guide