Colors establish a strong brand identity, evoke emotions, and direct user attention to specific sections of your website. A thoughtful color palette makes your site visually appealing and memorable for your visitors. This guide explains how to edit your website colors, choose color schemes, and use custom options to personalize your text, buttons, and layouts.
To manage your website colors, follow these steps:
In the Website Editor, click on Design in the top menu.
Select Colors from the drop-down list.
Use the side menu to browse available color schemes or select custom options.
Choose the Popular option to select from pre-made palettes or generate your own:
Selection - Click a color scheme to apply it instantly, or click the plus button to see additional variations.
Customization - Click each individual color within a scheme to select a new one from the color picker.
Filtering and Favorites - Use the filter to display schemes based on specific colors or click the heart icon to mark a palette as a favorite.
Generation Tools - Click the Palette icon to create a scheme using a hashtag code, or use the Image icon to generate a palette based on your homepage cover image.
Use the Custom option to refine specific elements across your website:
Main Color and Buttons - Choose the primary color for links and essential sections. Use the "Apply to all" buttons to quickly sync this color across all elements and button text.
Menu Colors - Customize the colors for your menu background, text, hover effects, borders, and page separation lines.
Page Colors - Set the background, text, and item colors for your Main Page, Second Page, and Internal Pages (pages not shown on the homepage).
Section and Footer - Adjust the main color for specific sections on your pages and choose the background and text colors for your footer.
Visual Hierarchy - Using a consistent main color helps users identify interactive elements like buttons and links more easily.
Brand Consistency - Generating a color scheme from your homepage image is a quick way to ensure your site colors match your primary branding.
Hover Effects - Remember to check your menu hover colors to ensure text remains readable when a visitor interacts with your navigation.
Verifying Text Color Visibility - After adjusting the text colors on your website, it's important to review the changes to ensure that the selected text color stands out against the background, text boxes, and button colors. If the text blends in with these elements, it could lead to issues where checkboxes, page content, and button text become "invisible."
