One of the most powerful features of Full Site Editing (FSE) is Global Styles.
But what does that actually mean?
In simple terms, Global Styles control the overall design system of your entire website. Instead of changing colors, fonts, or spacing one by one on every page, you change them once and they update everywhere automatically.
What does Global Styles Control? #
When you edit Global Styles, you are changing:
- Website colors
- Typography (fonts, sizes, weights)
- Button styles
- Link styles
- Background colors
- Spacing (margins & padding)
- Block styling defaults
- Layout width
These changes apply across:
- Homepage
- Blog posts
- Pages
- Archives
- Header
- Footer
Everything.
Why Global Styles Matter #
Without Global Styles, you would need to:
- Manually change every heading color
- Update every button individually
- Adjust fonts in every template
That would be slow and inconsistent.
With Global Styles:
- Your design stays consistent
- Your branding remains clean
- Changes take seconds instead of hours
For example:
If you change the primary color in Global Styles, all buttons and links using that color update instantly.
When should you use Global Styles? #
You should use Global Styles when you want to:
- Rebrand your website
- Change typography site-wide
- Adjust default button styling
- Modify background colors
- Create a consistent visual identity
If you’re only changing one specific section on one page, you don’t need Global Styles.
But if you want changes across the entire website — this is the right place.
How to access Global Styles #
- Go to Appearance → Editor
- Click on the Styles icon (the half black / half white circle in the top right)
- Click on Edit Styles
Now you are inside Global Styles.
From here, you can control your website’s visual system.
Important Note #
Global Styles affect the whole website.
If you change the heading font here, all headings across your site will change.
So use it intentionally.
