Global Theme Styles Introduction

What Are Global Theme Styles?

Global theme styles is a centralized settings area where you define the default styles for your entire Generator theme site. Instead of styling each page or element individually, you configure things like typography, colors, button styles, and spacing once — and every page and module inherits those styles automatically.

You can still override styles at the page or module level when needed, but maintaining a single source of truth keeps your site consistent and makes site-wide updates much faster.

When to Set Up Global Theme Styles

You should configure your global theme styles as one of the first things you do — ideally before you start building any pages.

How to Access Global Theme Styles

1. Go to your Website Pages or Landing Pages area in HubSpot.
2. Open any existing page.
3. Click Edit to enter the page editor.
4. Click Theme in the editor toolbar.

This opens the global theme styles panel.

What You Can Configure Here

Inside global theme styles, you'll find settings for:

• Colors — your site's color palette
• Fonts — typography defaults across the site
• Spacing — global spacing values
• Text styles — headings, body text, and more
• Button styles — default button appearance
• Forms — form field and layout styling
• Header & Mega Menu — styles for your global site header

Each of these areas will be covered in its own dedicated lesson. This lesson is just an orientation to what global theme styles are and how to think about them as you build your site.