Adding branding (colors & fonts) to your account

Qwilr's brand editor lets you add a palette of colors and fonts and get a clearer overview of your brand style. You'll create documents that stand out while consistently reflecting your company's brand.

In this article we'll cover account-wide branding. If you want to modify the style of an individual block or Qwilr Page, check out our styling tools.

Note: These settings are only available to account admins.

In this article:

To set up your brand colors and fonts, click on your initials in the top right corner of Qwilr. Then choose  Set Up Brand.

Brand colors

The colors you select in Brand Setup will apply to all projects in your account. You can have up to 7 brand colors.

How brand colors apply to text

The first brand color is used as the default color for the following elements:

  • Heading 1 (H1)
  • Links
  • Background colors

The second color is used as the default for the following elements:

  • Heading 2 (H2)
  • Background colors

To change any of your brand colors, click on a circle to bring up the edit menu.

Clicking a brand color to edit it

Choose a color from the menu or paste in your own hex color code. Then click Update Color.

Choosing a new brand color from the menu

Here are some useful tools for finding hex color codes:

If you've already created some Qwilr Pages in your account, you'll see a warning message letting you know that the colors in these pages will be changing to the new default you've set. Click Update Color to save the change and update the pages.

Button to confirm the color update

Adding more brand colors

To expand your brand colors, click on the circle with a + sign. Choose a color from the menu or paste in a hex color code, then click Add Color.

Clicking the empty circle to add a new brand color

The first two colors in the set will still be your account defaults, but the additional colors will appear in your Block Styles menus to select as background, text, and element colors.

When you're done adjusting colors, click  Update Brand to save the changes.

Button to confirm the brand update

Note: There may be cases where Qwilr limits the selection of available brand colors in a block. This will only happen when a particular color would affect readability.

Note: In addition to your 7 brand colors, you can also add any hex color code to a block as a custom background color.

Brand fonts

The fonts you select in Brand Setup will apply to all projects in your account.  Different fonts can be selected for Heading (H1), Subheading (H2) and Body text. As a default, all three are set as Open Sans.

To change a font, click the Change button.

Clicking the Change button to update a font

You'll have three options:

Note: Adobe (Typekit) fonts can be used on our Business and Enterprise plans. Custom fonts are available on our Enterprise plan.

Using a single brand font

Once you've selected a brand font for H1, you can set it as the brand font for all text by enabling the switch as shown below.

Clicking the switch to set the same font for all 3 classes

Using our recommended font pairings

If you're not sure which fonts to use, try our font pairings to make the selection quick and easy. Click the Show Font Pairings button.

Button to show font pairings

Scroll through to find a combination you like. Click on it, and you'll see a display of fonts. Click Try Fonts to install them as your brand fonts.

Button to suggest font pairings

You'll still be able to change any fonts at any time. When you change a brand font, all existing pages in your account will be updated with the new font.

When you're done setting fonts, click  Update Brand to save the changes.

Button to confirm the brand update

That's it! Your branding is now set up, and all your pages will have a consistent look that matches your brand style.

Team styling permissions

Note: This feature is available only on our Enterprise plan.

Once you've set up your brand colors and fonts, you can decide how much or little access the Creator users on your team will have to styling controls. In the Team Permissions section, you can use the switches to enable or disable styling tools your team can access in Qwilr Pages. 

Settings menu for team-level styling permissions

You can place controls on two types of styling:

  • Block style controls: these are styling changes made to whole blocks. Your team would access these by clicking the Block Style icon in any block.

Block style controls are located in the top left corner of each block

  • Content style controls: these are styling changes you'd make after highlighting one element of a block. The same styling icon will appear. Clicking this brings up more styling options.

Highlight any text to bring up the styling toolbarAs you change the permission settings, you'll see a preview of what your team's Block Style menu will look like.

Animation of updating the team-level styling permissions

If you'd prefer your team not edit any styling in the pages they create, disable both the  Edit block styles and Edit content styles switches. All settings will be disabled and the Block Style menu won't appear.

All styling permissions disabled

What's Next:

Use your brand colors to style parts of your Qwilr Page

Still need help? Contact Us Contact Us