Your website's color scheme plays a crucial role in its visual appeal and user experience. Here's how to effectively manage colors across your site:

Changing Website-Wide Colors

Open website styles menu and click "Colors" Select "Edit Palette" to choose from:

• Presets: Curated color combinations
• From Image: Generate palette from uploaded image
• From Color: Create palette based on primary color choice

Note: All palettes include black and white for text elements. You can fine-tune individual colors using the palette editor.

Modifying Section Colors

To check current section designs:

1. Open website styles menu
2. Click "Colors"
3. Review section design labels in preview

To change section colors:

1. Open Pages menu
2. Select page and click Edit
3. Click Edit Section or pencil icon
4. Choose design from Colors tab
5. Save changes

Design Types:

• Very Light/Dark 1: Black/white text with colored backgrounds
• Very Light/Dark 2: Palette colors for text with complementary backgrounds

Customizing Specific Elements

For individual elements:

1. Open website styles menu
2. Select specific design
3. Choose element to modify
4. Select new color from palette or custom picker
5. Adjust opacity if needed

Color Picker Options:

• HEX (e.g., #FFFFFF)
• RGB/rgba (e.g., rgba(255, 0, 149, 1))
• HSL/HSLA (e.g., hsla(325, 100%, 50%, 1))
• HTML color names (lowercase)

Special Areas

• Notification Bar: Matches header design
• Mobile Menu: Follows header colors
• Integrated Pages: Uses template's default scheme
• Background Colors: Can be added to specific blocks like forms, quotes, and accordions

Accessibility Considerations

• Maintain sufficient contrast between text and background
• Consider color-blind users when selecting combinations
• Test readability across different screen sizes

For version 7.0 websites, access color settings through Website Styles menu and refer to template-specific documentation for detailed guidance.

Remember: Changes to website styles affect all pages using that design. Test your color scheme across different devices to ensure consistency and readability.

Related Articles

Previous Articles