Hupspot email brand styling guide
Consistent visual branding in Hubspot marketing email is essential if you want subscribers to recognize your company at a glance. By configuring global email styles, you control fonts, colors, buttons, and links for every message created from a template, saving time and keeping your layouts on brand.
How global styling works in Hubspot email templates
In the Hubspot design tools, templates use a Default email style group that defines the look of core elements such as body text and headings. These styles apply automatically when you build emails from the template, unless you manually override them in the email editor.
When you set global styles, you can define:
- Base font family and size for the message body
- Heading sizes, weights, and colors
- Default text and background colors
- Link color and hover color
- Button colors, borders, corners, and spacing
The goal is to configure these options once, so every new email inherits your brand styling without extra work.
Accessing the Design Manager in Hubspot
To apply brand styles, you must work in the design tools section of your account. This is where email templates and modules live.
- Sign in to your Hubspot account.
- In the main navigation bar, go to Marketing > Files and Templates > Design Tools.
- In the left sidebar, find the email template you want to edit.
- Click the template name to open it in the layout editor.
Once the template is open, you can locate the global styling group that controls default formatting.
Finding the Default email style group in Hubspot
Every drag-and-drop email template includes a special module group labeled Default email style. This is the container for your global settings.
- Look at the layout tree or main canvas for a group called Default email style.
- If you do not see it immediately, expand any groups in the layout sidebar to reveal nested modules.
- Click the Default email style group to select it.
- In the right sidebar inspector, click Styles or the gear icon to open the styling editor.
All branding options you configure here will apply across the entire email template.
Brand text styling in Hubspot email templates
Start by aligning the basic typography in your Hubspot template with your brand guidelines. This includes font families, sizes, and colors.
Set global body text styles in Hubspot
- With the Default email style group selected, open the Text or Typography section.
- Choose your primary font family. For best compatibility, use a web-safe font or a fallback stack that matches your brand.
- Set the base font size and line height for body copy.
- Pick the default text color that matches your brand palette and passes accessibility contrast guidelines.
- Adjust paragraph spacing so copy is easy to skim on desktop and mobile.
Once these settings are saved, any new rich text module will automatically inherit this body style, unless you manually override it inside the email editor.
Configure heading styles in Hubspot
Next, define consistent visual hierarchy for headings so your content scans clearly.
- In the same styling pane, locate the Headings section.
- For each heading level (H1, H2, H3), set:
- Font family (often the same as body, or a bold variant)
- Font size and weight
- Text color
- Top and bottom margins
Use larger, bolder styles for higher-level headings. This makes long email content more readable and ensures your Hubspot templates feel aligned with your website design system.
Color and background settings in Hubspot
Color consistency is crucial for recognition and accessibility. In the Hubspot template editor, you can define default colors for the overall email background and content areas.
Set the email background color
- With the Default email style group selected, open the Background section.
- Choose a background color for the entire email canvas, usually a light neutral that supports your brand.
- If needed, define a different color for the main content area to create contrast with the outer background.
- Apply and save your changes.
These settings ensure every email built from this template starts with the correct background without manual tweaking.
Configure default colors for links
Hyperlink styling should be consistent with your brand accent color and remain legible.
- Open the Links or Anchor styling section.
- Set a default link color that matches your primary or secondary accent.
- Optionally define a hover color to give users a clear interaction cue.
- Confirm that link colors maintain contrast against the background for accessibility.
Once configured, any standard link in your email content will follow these default styles unless explicitly changed.
Button styles in Hubspot email templates
Call-to-action buttons are one of the most important elements in your marketing messages. Hubspot templates allow global button configuration so every CTA looks consistent.
Set global button colors and borders
- In the Default email style group, open the Buttons styling area.
- Choose a background color for buttons, typically your main accent color.
- Set the text color, usually white or a dark shade that contrasts with the button background.
- Configure border color, width, and style if you use outlined or ghost buttons.
- Define hover styles, such as a darker shade or slight border change.
These settings ensure every button module placed in the email template automatically reflects your brand visuals.
Adjust button typography and spacing in Hubspot
- In the same button styling section, set the font family, weight, and size for button text.
- Adjust padding (top, bottom, left, right) so buttons feel balanced and are easy to tap on mobile devices.
- Define border radius to control whether buttons are square, slightly rounded, or pill-shaped.
- Review alignment options (centered or left-aligned) to match your overall layout style.
Save your changes, then preview a sample email to confirm that all CTAs follow the new global button style.
Previewing and testing your Hubspot email styles
After updating the template, you should verify that your styles render correctly in the email editor and in real inboxes.
- Click Preview in the template editor to see how your brand styles appear.
- Create a new marketing email based on the updated template.
- Confirm that text, headings, links, and buttons inherit the global settings.
- Send test emails to multiple email clients and devices to check consistency.
If anything appears off, return to the Hubspot design tools, tweak the relevant style section, and test again.
Managing overrides and local styles in Hubspot
While global styles keep branding consistent, individual modules in the email editor can still be customized when needed.
- Use local styles sparingly for special campaigns or unique sections.
- Avoid changing fonts and colors for small, one-off edits that break brand consistency.
- If you find yourself repeating the same local overrides, consider updating the global styles in the template instead.
This approach keeps your Hubspot account easier to manage while still supporting occasional creative variations.
Additional Hubspot resources and support
For more detailed, official documentation on template styling, you can review the Hubspot knowledge base article on applying brand styling to marketing email templates at this page.
If you want strategic help designing conversion-focused email templates that align with your Hubspot implementation, consider working with a specialist agency such as Consultevo for consulting and technical setup.
By taking the time to configure these global settings once, every email you build in Hubspot will reflect your brand identity automatically, reduce production time, and deliver a more professional experience for your subscribers.
Need Help With Hubspot?
If you want expert help building, automating, or scaling your Hubspot , work with ConsultEvo, a team who has a decade of Hubspot experience.
“`
