Learn how to create a one-page logo usage sheet that keeps your brand looking consistent across your website, social media, and print materials.
Video
Why a Logo Usage Sheet Matters
Your logo is often the first thing people recognize about your brand. When it’s stretched, recolored, or placed on the wrong background, your brand starts to look unprofessional and inconsistent.
A simple, one-page logo usage sheet gives your team and partners clear rules so your logo always looks correct on your WordPress website, social media, and printed materials.
What Your Logo Usage Sheet Should Include
Keep the document short and visual. Aim for a single page (or two at most) with clear examples instead of long paragraphs.
1. Approved Logo Versions
List the exact logo versions that are allowed. Typically, you will have:
- Full-color primary logo
- Single-color (usually dark) logo
- Reversed (white) logo for dark backgrounds
- Optional icon or mark-only version
For each version, show a small preview and the exact file names so people know which files to use.
2. File Types and When to Use Them
Clarify which file types should be used in which situations. This prevents blurry or pixelated logos on your site and in print.
- SVG – Best for your WordPress website and Elementor layouts when supported (crisp at any size).
- PNG – For web use when transparency is needed (e.g., over images or colored backgrounds).
- JPG/JPEG – For web use on white or solid backgrounds when transparency is not required.
- PDF/EPS – For printers and designers who need high-resolution, scalable files.
Include a short table like this in your sheet:
- Website header: logo-primary.svg or logo-primary.png
- Social media graphics: logo-icon.png
- Print materials: logo-primary.pdf
3. Minimum Size and Clear Space
Logos that are too small or crowded by other elements become hard to read. Add two simple rules:
- Minimum width: e.g., 160px for web, 25mm for print.
- Clear space: a buffer around the logo where no text or graphics can appear.
A common approach is to use part of the logo itself (like the height of a letter) to define the clear space. Show this visually with a simple diagram.
4. Backgrounds: What Is Allowed and Not Allowed
Explain which backgrounds work and which do not. Include side-by-side examples:
- Logo on white or very light backgrounds (primary version)
- Logo on dark backgrounds (reversed/white version)
- Logo on photos with enough contrast
Also show incorrect examples:
- Logo on busy, high-contrast photos where it’s hard to read
- Logo placed on colors too similar to the logo color
- Logo over gradients that reduce legibility
5. Color Rules for the Logo
State clearly which colors the logo may use and which are not allowed.
- List the official logo colors (HEX, RGB, CMYK).
- Show the primary color version and any approved alternatives (e.g., all-white, all-black).
- Explicitly say: “Do not change the logo colors.”
6. “Do Not” Examples
This section is one of the most useful parts of your sheet. Show quick visual examples of what must never be done to the logo:
- Do not stretch or squish the logo.
- Do not rotate or tilt the logo.
- Do not add drop shadows, outlines, or glow effects.
- Do not place the logo inside shapes that are not part of the design.
- Do not change the font in the logo.
Use red X marks or “Incorrect” labels so the difference is obvious at a glance.
How to Organize Your Logo Files for Easy Access
A logo usage sheet only works if people can quickly find the correct files. Create a simple, shared folder structure.
Recommended Folder Structure
- Brand
- 01-Logo
- Web
- SVG
- PNG
- JPG
- Print
- EPS
- Web
- 02-Colors
- 03-Typography
- 01-Logo
Place your logo usage sheet as a PDF in the 01-Logo folder so it’s always next to the actual files.
Using Your Logo Correctly in WordPress and Elementor
Once your sheet is ready, apply it consistently on your website.
Step 1: Upload the Correct Logo Files
- Go to Dashboard ? Media ? Add New.
- Upload your approved web logo files (SVG/PNG/JPG) from your organized brand folder.
- Rename files if needed so they match the names listed on your logo usage sheet.
Step 2: Set the Site Logo
- Go to Dashboard ? Appearance ? Customize (or your theme’s options panel).
- Look for Site Identity or Header.
- Select the correct logo file (usually the primary full-color version).
- Check the logo size against the minimum size rule in your sheet and adjust if needed.
Step 3: Use the Right Logo in Elementor
- Go to Dashboard ? Templates ? Theme Builder and edit your header template with Elementor (if applicable).
- Select the Site Logo widget or Image widget.
- Confirm it is using the correct logo file from your sheet.
- Check how it appears on desktop, tablet, and mobile views.
What You Should See
- The logo is sharp, not blurry or pixelated.
- The logo has enough space around it and is not crowded by menu items.
- The logo is readable on all background colors and images used in the header.
- The same logo version appears consistently across all pages.
Sharing the Logo Usage Sheet With Your Team
To make sure everyone follows the same rules, share the sheet in places your team already uses:
- Link it in your internal documentation or project management tool.
- Share it with freelancers, printers, and partners whenever you send logo files.
- Keep a copy in your shared cloud storage (Google Drive, Dropbox, etc.) next to the logo folders.
Encourage your team to check the sheet before creating new graphics, updating the website, or sending files to a printer.
Quick Checklist: Is Your Logo Usage Sheet Ready?
- Approved logo versions with file names
- File types and when to use each
- Minimum size and clear space rules
- Allowed and not allowed backgrounds
- Official logo colors and color rules
- Visual “do not” examples
- Shared folder with organized logo files
If you can check off each item, you now have a practical logo usage sheet that will keep your brand looking consistent everywhere it appears.