
How to Add Custom Background Art to Squarespace Sections
Create unique background art for your site sections using Squarespace's built-in generator. The tool offers animated patterns, gradients, and customizable shapes to enhance your website's visual appeal.
Compatible Sections:
- Automatic layout sections
- Portfolio sections
- Block page sections
Note: Gallery and collection sections don't support background art.
Technical Requirements:
- Browser must support WebGL
- Check compatibility at get.webgl.org
- Non-supporting browsers will display static backgrounds
Adding Background Art:
- Open Pages panel
- Select target page
- Click Edit
- Click section's pencil icon
- Select Background
- Click Art
- Choose design tile
- Select Full Bleed or Inset width
- Save changes
Customization Options:
- Invert Colors: Switch color schemes
- Randomize: Generate random configurations
- Pattern adjustments
- Motion controls
- Size modifications
- Shape variations
Important Considerations:
- Ensure text remains readable against background
- Adjust font colors through section's color theme
- Animated backgrounds include pause button for accessibility
- Colors match site's Vibrant Colors palette
Tips for Optimal Use:
- Test different variations using preview circles
- Experiment with detail panel settings
- Consider content visibility when selecting patterns
- Balance animation with readability
- Use the pause feature for user comfort
Remember to maintain proper contrast between background art and content for optimal user experience and accessibility.
Related Articles

How to Choose the Best Squarespace Template for Your Website
