Fonts in Squarespace: A Complete Guide

Font system overview:

• Access to 600+ Google Fonts and 1,000+ Adobe Fonts
• Fonts create unified site appearance
• Font rendering may vary across devices and browsers
• Font changes affect all instances of that text style site-wide

Font Selection Process:

1. Open Site Styles panel
2. Navigate to Fonts section
3. Choose from Sans-serif, Serif, or Mixed packages
4. Set base font size (Version 7.1)
5. Save changes

Customizing Specific Fonts:

1. Click "Allocate styles"
2. Select text group (Title, Button, etc.)
3. Choose font style from dropdown
4. Adjust additional options:
   • Weight
   • Line height
   • Letter spacing
   • Text transformation
   • Size

Finding Specific Fonts:

1. Use "Explore all fonts" option
2. Search by name in search field
3. Browse complete library
4. Preview fonts on site before applying

Advanced Font Features:

• Custom Adobe Fonts integration (Version 7.0)
• System fonts option available
• Text size responsiveness across devices
• Font package customization

Troubleshooting Common Issues:

1. Formatting inconsistencies

   • Use Ctrl/Cmd + Shift + V when pasting
   • Click Remove formatting icon

2. Mobile readability

   • Keep font weight above 100
   • Test responsiveness

3. Size restrictions

   • Version 7.1 uses rem values
   • Version 7.0 uses em or px values

4. Font loading issues

   • Verify JavaScript is enabled
   • Check domain masking
   • Ensure proper Adobe Fonts integration

Best Practices:

• Maintain consistent styling across pages
• Test fonts across different devices
• Consider readability on all screen sizes
• Keep backups of font selections
• Regular testing of font appearance

Related Articles

Previous Articles