Apply custom CSS to style your Squarespace site with advanced font, color, and background options not available through built-in settings. Use CSS modifications only for styling purposes to avoid potential site issues.

Adding CSS Code:

1. Open the custom CSS panel
2. Click [Open in New Window] for an expandable editor
3. Add your custom code
4. Click [Save] to publish changes

Line numbers appear on the left to help reference code sections. Syntax errors display in red at the bottom.

Working with Custom Files:

1. Click [Custom Files] under the CSS Editor
2. Click [Add Image or Font] or drag files to upload
3. Supported file types:
   • Images: .jpg, .png, .gif
   • Fonts: .ttf, .otf, .woff
   • Note: .svg files not supported

Using Custom Files in Code:

1. Write your code until you need the file URL
2. Place cursor at the desired location
3. Click the file to automatically insert its URL

Important Notes:

• Custom CSS doesn't transfer when switching templates in version 7.0
• Update file URLs when changing SSL settings
• If SSL is enabled:
  1. Open CSS editor
  2. Click [Manage Custom Files]
  3. Click the file
  4. Update URL to start with https
  5. Save changes

For additional support:

• Review the Custom Code FAQs
• Consult the Basic Guide to Code-Based Customization
• Visit the Squarespace Forum
• Consider hiring a Squarespace Expert for custom solutions

Related Articles

Previous Articles