Creating a brand in Guidelines
This tutorial walks through the process of creating a new brand in Guidelines, including adding logos, defining colors, and setting up fonts and typography styles.
Starting a New Brand
You can create a new brand in Guidelines in two ways:
- While creating a site.
- From the tab in your dashboard.
In this example, we'll create a brand during the setup of a new guidelines website by clicking when prompted.
Adding Logos
The first step is to upload your brand logos. Vector files such as SVG are preferred over raster formats for quality and scalability.
Once uploaded, Guidelines automatically organizes your logos and extracts brand information such as colors and names. You can:
- Rearrange the order of logos (e.g., main logo first, icon second, wordmark last).
- Choose between light and dark versions.
- Add additional file formats (PNG, JPEG, RGB, CMYK, Illustrator, EPS) for download by collaborators.
Adding Colors
Guidelines pulls in colors from your logos automatically, but you can also add more manually.
For each color, you can:
- Define digital values (Hex, RGB, HSL).
- Specify print values (CMYK, Pantone).
- Set coated or uncoated finishes for print designers.
Colors can be rearranged and grouped, and changes apply across all values simultaneously.
Adding Fonts and Typography
Fonts can be added in several ways:
- Upload licensed fonts directly.
- Select Google Fonts from the library.
- Add Adobe Fonts with a project ID.
In this example, we added Work Sans (Google) and Owners (Adobe).
Once fonts are added, configure typography styles. Guidelines provides defaults such as three heading levels, body text, and fine print. You can adjust:
- Font family
- Size
- Letter spacing
- Line height
Changes update instantly in the preview pane.
A Living Brand Document
Your brand setup is flexible—logos, colors, and fonts can be edited at any time. Brands evolve over time, and Guidelines allows you to update assets, add new colors, or change typography styles directly from the branding screen or within the editor.
Next Steps
With your brand created, you're ready to apply it to a site using a template.