Changing fonts, colors & site styles
How to update your site-wide fonts, colors, spacing, and design settings using Squarespace's Site Styles panel.
Squarespace's Site Styles feature lets you change how your entire website looks — fonts, colors, button styles, and spacing — from one central place. A change here affects every page at once, so it's a powerful tool to use carefully.
Quick summary
Go to Design > Site Styles in your dashboard to access font and color settings. Changes here affect the whole site. Click Save to apply. If you're unsure about a change, ask Chykalophia before making it.
Opening Site Styles
Log in and open your website dashboard.
Click Design in the left panel.
Click Site Styles. The Site Styles panel opens — on some templates this may be labeled "Style Editor."
The panel shows a live preview of your site on the right, and the style controls on the left.
What you can change
The available settings depend on your Squarespace template. Common options include:
Fonts
- Heading font — the font used for H1, H2, and H3 headings across the site
- Body font — the font used for paragraph text
- Font size — the base size for body text (headings scale from this)
To change a font, click on the font name and choose from the list of available fonts. Squarespace includes Google Fonts and some Adobe Fonts.
Stick to 2 fonts maximum
Using too many fonts makes a site look unprofessional. Your Chykalophia designer chose your fonts intentionally. If you want to change them, discuss it with us first to ensure the result stays on-brand.
Colors
- Site colors — your brand's palette. Changing a color here updates it everywhere it's used.
- Background color — the default background for pages
- Accent color — typically used for buttons, links, and highlights
To change a color, click the colored square next to the option and use the color picker to choose a new color. You can enter a hex code (like #2D5BE3) for an exact brand color.
Buttons
Control the shape, color, and size of buttons across your site. Options usually include:
- Rounded vs. square corners
- Solid fill vs. outlined style
- Hover color effects
Spacing and layout
Some templates let you control:
- Page width — how wide the main content area is
- Section padding — the space above and below sections
Saving and reverting
- Click Save to apply your changes.
- To undo a change, use Ctrl+Z (Windows) or Cmd+Z (Mac) while the Site Styles panel is open.
- If you want to revert everything, you'll need to manually reset each setting — there's no single "undo all" button.
Site Styles affects the whole site
Any change you make in Site Styles will affect every page. If your site is live, visitors will see the change as soon as you save. Test on a less prominent page first if you're trying something new, or ask Chykalophia to make the change on a staging site.
Common questions
Related guides
Need a hand?