Easily add and customize unique background patterns to your website sections for a more dynamic design.

Background patterns work with auto layout, portfolio, and page section blocks (not available for Gallery or Collection sections). These patterns use WebGL technology and include accessibility features like a pause button for animated backgrounds.

Adding Background Patterns:

1. Open Pages panel and select your target page
2. Click Edit
3. Select the section's pencil icon > Background
4. Choose Pattern and click a thumbnail
5. Select design variations using the circles above thumbnails
6. Pick Full Page or Inset width

Customization Options:

• Reverse Colors: Swap assigned color schemes
• Random: Test random configurations
• Pattern-specific settings: Adjust components using sliders and selectors
• Color themes: Patterns use Bright options from your color palette

Technical Requirements:

• Requires WebGL support (check at get.webgl.org)
• Without WebGL, background remains static
• Ensure text remains readable against patterns
• Adjust text color through section color theme settings

Important Notes:

• Animated patterns include a pause button for accessibility
• Background patterns support multiple design variations
• All changes can be previewed in real-time
• Settings vary based on selected pattern style
• Custom options available for detailed pattern adjustments

Keep text visible and maintain good contrast when using patterns. Test different combinations of settings to achieve your desired visual effect while ensuring accessibility for all visitors.

Related Features:

• Section background images
• Site-wide animations
• Custom site backgrounds
• Image block effects
• SEO optimization

Related Articles

Previous Articles