Edit your brand's logo, favicon, brand colors, fonts, and theme

Users with Edit account defaults permission access can edit your brand's logo, favicon, brand colors, theme, and fonts in your brand kit. 

Please note: you can create one brand kit per account. If you have the Brands add-on, you can create one brand kit per Brand.

Add or edit your logo

In your account settings, you can edit your default logo. You can override this logo for individual pieces of content. 

• In your HubSpot account, navigate to Content > Brand.
• If you're using the Brands add-on, click the dropdown menu in the top-right and select the Brand you'd like to update the logo for.

• In the Brand Kit section, click Logos. 
• Add your new logo:
  
  • To add an existing image from the files tool as your logo, click Browse images. In the right panel, click the image. 
  • To add a new image, click Upload, then add an image from your computer. 
• In the Logo name field, enter a name for the logo. This field is required. 
• In the Logo alt text field, enter a description of your logo for search engines and screen readers. This improves the accessibility and SEO of your site. Learn more about website accessibility in HubSpot's developer documentation. 
• In the Logo URL field, enter a URL if you want your logo to be clickable. 
• To resize your logo, enter a new dimension in the Width or Height field. The other field will automatically adjust to keep the image's proportions. 
• To add another logo, click + Add at the bottom of the Logos section.
• To delete an existing image, click the X in the centre of the image.

• To change the default logo, hover over the logo you'd like to use as the default, click the Actions dropdown menu, then select Make default.
• To delete a logo, click the Actions dropdown menu, then select Delete.

• When you're finished editing your logo, click Update in the bottom left. 
• You can override a default logo for specific content in the content editor or Design Manager. In the Logo module, click to toggle the Override default logo switch on, then upload a  logo. 

Add or edit your favicon

In account settings, you can customize your website's favicon, the small image in a browser tab next to the page title. Your favicon will only be applied to content hosted on HubSpot. 

Please note: you can add up to 20 favicon's per Brand.

• In your HubSpot account, navigate to Content > Brand.
• If you're using the Brands add-on, click the dropdown menu in the top-right and select the Brand you'd like to update the logo for.

• In the Brand Kit section, click Favicons. 
• Add your new favicon:
  
  • To add an existing image from the files tool as your logo, click Browse images. In the right panel, click the image. 
  • To add a new image, click Upload, then add an image from your computer. 
• In the Favicon name field, enter a name for the favicon. This field is required. 
• To add another logo, click + Add at the bottom of the Favicons section.
• To delete an existing image, click the X in the centre of the image.

• To change the default favicon, hover over the favicon you'd like to use as the default, click the Actions dropdown menu, then select Make default.
• To delete a logo, click the Actions dropdown menu, then select Delete.

• When you're finished editing your favicon, click Save in the bottom left. 

Add or edit your brand colors

You can set brand colors in your settings that'll appear in the content editor, as well as scheduling pages, quotes, and conversations channels. Brand colors will not appear in sales templates and emails. 

• In your HubSpot account, navigate to Content > Brand.
• If you're using the Brands add-on, click the dropdown menu in the top-right and select the Brand you'd like to update the logo for.

• In the Brand Kit section, click Colors.
• To set your brand colors:
  
  • Primary color: the main color used in your brand. Under Primary color, enter a hexadecimal code or click the color picker and select a color. Then click Save. Primary color is a required field.
  • Secondary color: the second most used color in your brand. Under Secondary color, enter a hexadecimal code or click the color picker and select a color. Then click Save.
  • Accent colors: complement your primary and secondary brand colors. Under Accent color, enter a hexadecimal code or click the color picker and select a color. Then click Save. You can add up to three accent colors.
  • Additional colors: aren't automatically used, but will be available in color pickers and can be referenced in development tools. Click add Add next to Additional colors, enter a hexadecimal code or click the color picker and select a color. Then click Save. You can add up to sixteen additional colors.
    • To delete an additional color, click delete delete  next to the color you want to remove, then click Save.

• You can also import colors from a live page that already uses your brand colors: 
  • Click Import colors from URL.
  • In the dialog box, enter the URL of a page using your brand colors and click Find colors. 
  • When the scan finishes, clear the checkbox next to any color you don't want to import, then click Import. 

Add, edit, or delete fonts

You can set primary, secondary, and custom fonts in your settings that'll be used across your content. To set your add or edit your fonts:

Add fonts

• In your HubSpot account, navigate to Content > Brand.
• If you're using the Brands add-on, click the dropdown menu in the top-right and select the Brand you'd like to update the logo for.

• In the Brand Kit section, click Fonts.
• To set the font that will be used for body text:
  • Under Body, click the Select font dropdown menu.
  • Enter the font name in the search bar, or select the font from the list.
  • Click Update.

• To set the font that will be used for headings and large text:
  • Under Primary, click the Select font dropdown menu.
  • Enter the font name in the search bar, or select the font from the list.

• • Click Update.

• To set a custom font that'll be available in the font selector in content editors:
  • Under Custom fonts, click + Add a custom font.
  • In the Font name field, enter the name of your font.
  • Click Choose font file(s).
  • Select the font files to upload from your computer. Supported file formats: TTF, OTF, and WOFF.
  • Click + Upload more files to add more font files.
  
  • Click Next.
  • Use the dropdown menus to select a corresponding font style.

• • Click + Add another font style to add additional styles.

• • Click Update.
  • You can add more than one custom font. To add another, go through the steps again.

Edit fonts

To edit existing fonts:

• In your HubSpot account, navigate to Content > Brand.
• If you're using the Brands add-on, click the dropdown menu in the top-right and select the Brand you'd like to update the logo for.

• In the Brand Kit section, click Fonts.
• To edit the font that will be used for body text:
  • Under Body, click the dropdown menu.
  • Enter the font name in the search bar, or select the font from the list.

• • Click Update.

• To edit the font that will be used for headings and large text:
  • Under Primary, click the dropdown menu.

• • Enter the font name in the search bar, or select the font from the list.

• • Click Update.
• To edit a custom font:

• • Under Custom fonts, next to the existing font, click Actions, then select Edit.

• • Use the dropdown menus to select a corresponding font style.

• • Click + Add another font style to add additional styles.
  • Click Update.

Delete custom fonts

To delete custom fonts:

• In your HubSpot account, navigate to Content > Brand.
• If you're using the Brands add-on, click the dropdown menu in the top-right and select the Brand you'd like to update the logo for.

• In the Brand Kit section, click Fonts.

• Under Custom fonts, next to the existing font, click Actions, then select Delete.

• In the dialog box, click Delete font.

Change your theme

A theme is a set of templates, modules, global content, and style settings that can be used to create a website. You can edit pages and posts using a theme in the content editor and set blog templates to use a theme in your blog settings.

All accounts have access to at least one default HubSpot theme. Themes can also be downloaded from the Template Marketplace.

Please note: knowledge bases use a modified version of themes. Learn more about editing knowledge base theme settings.

To change your theme:

• In your HubSpot account, navigate to Content > Brand.
• If you're using the Brands add-on, click the dropdown menu in the top-right and select the Brand you'd like to update the logo for.

• In the Brand Kit section, click Theme.
• Select Change theme to select a different theme.
  • • Your available themes will be displayed. Click Set as active theme next to the theme you'd like to use for your brand. 
    • Click View themes in the Marketplace to view other themes available for download.
  • Select Edit to edit your theme settings.
  • Select Preview to preview how your theme will look.