Email Campaign Styles in Squarespace
TL;DR:
- Apply global styles like fonts, text sizes, and colors to keep your brand consistent
- Use the "Quickly Match Your Site" tool to sync your campaign with your website branding
- Font packs ensure your text displays properly across different email clients
- Adjust individual section styles for specific content areas
- Save time by duplicating previous campaigns as style templates
Email campaigns in Squarespace give you control over how your emails look and feel. Getting the styling right means your emails will look professional and match your brand.
Understanding Global Styles
Global styles affect your entire email campaign. These are the big-picture design choices that create consistency across all your content.
Your global style options include:
Fonts – Keep text looking the same throughout your email
Text sizes – Make sure everything's readable on different devices
Link colors – Consistent styling for all your hyperlinks
Background color – The area that sits outside your main content
To adjust these settings, click outside any content box while you're editing your campaign draft.
Syncing Your Campaign with Your Website
The easiest way to keep your emails on-brand is to match them with your existing website design.
Here's how to do it:
- Open the Style panel while editing your draft
- Click "Insert Logo" to add your site logo
- Use "Quickly Match Your Site" to automatically sync your colors
If you make changes you don't like, use the undo arrow to revert back.
Working with Font Packs
Font packs are pre-designed font combinations that work reliably across most email clients. This matters because email clients can be picky about which fonts they'll display properly.
Pick a font pack that fits your campaign's tone. If you need to highlight specific text but want something the font pack doesn't offer, consider adding that text as an image instead.
Adjusting Text Sizes
You have two main controls for text sizing:
Base Font Size slider – Controls your body text size
Type Scale slider – Sets how much bigger or smaller your headers are compared to body text
Keep in mind that some elements like button labels and footer text have fixed sizes that you can't change.
Managing Colors
Squarespace gives you two color palettes to work with:
Email Palette – Custom colors just for your campaigns
Site Palette – Colors pulled from your website
To add or remove colors from your Email Palette:
- Click on the color you want to change
- Use the color picker to add new colors
- Click the 'X' to delete colors you don't need
Background Color Options
You can set different background colors for different layers:
Email Background – The area outside your main content
Content Background – Behind your campaign sections
Section Color – Individual section backgrounds
Select the area you want to change and adjust the color using the side panel.
Making Sure Your Emails Look Good on Mobile
Squarespace email campaigns use responsive design, which means they automatically adjust for different screen sizes. Text and images resize, and content stacks vertically on narrow screens.
Always preview your campaign in mobile view before sending. Check that everything aligns properly and remains readable on smaller screens.
Styling Individual Sections
Each section of your campaign can have its own styling. This includes images, text blocks, buttons, and other content elements.
Use the right panel tools to fine-tune how each section looks. This is where you can make specific parts of your email stand out while keeping the overall design consistent.
Reusing Styles for Future Campaigns
Save yourself time by duplicating campaigns that already have the styling you want. This works well for regular newsletters or promotional emails where you want to keep the same look.
You can also use previously sent campaigns as templates. This maintains consistency across all your email marketing with minimal setup work.
FAQs
Can I customize fonts within a font pack?
Font packs are fixed combinations designed for maximum email client compatibility. If you need custom fonts, include that text as an image instead.
What if I accidentally delete a color from my Email Palette?
If that color is still being used somewhere in your campaign, you can re-add it by accessing it through that section's settings.
How do I make my campaign match my website exactly?
Use the "Quickly Match Your Site" feature in the Style panel. This automatically syncs your logos and color schemes.
Jargon Buster
Global Styles – Design settings that apply to your entire email campaign
Font Pack – A pre-selected set of fonts that work reliably across email clients
Responsive Design – Automatic adjustment of layout and content for different screen sizes
Wrap-up
Good email styling in Squarespace comes down to understanding both global and section-specific options. Use global styles to maintain brand consistency, then fine-tune individual sections as needed. The key is creating emails that look professional and are easy to read, regardless of where your subscribers open them.
Ready to put these styling techniques into practice? Join Pixelhaze Academy to learn advanced email marketing strategies: https://www.pixelhaze.academy/membership