How to Change Colors

Customize your website’s colors to match your brand identity.

Accessing Color Settings

1. Open your website in the editor
2. Click Settings tab
3. Go to Theme section
4. Find Colors area

Color Options

Primary Color

Your main brand color, used for:

• Buttons
• Links
• Accents
• Highlights

Secondary Color

Supporting color for:

• Secondary buttons
• Backgrounds
• Borders

Background Color

Page background color:

• Main page background
• Section backgrounds

Text Color

Default text color:

• Body text
• Headings
• Labels

Changing Colors

1. Click the color swatch
2. Use the color picker or enter hex code
3. Preview updates automatically
4. Changes save automatically

Using Hex Codes

Enter colors as hex codes:

#3B82F6  (blue)
#10B981  (green)
#F59E0B  (orange)
#EF4444  (red)

Color Tips

Contrast

Ensure sufficient contrast:

• Text should be readable
• Buttons should stand out
• Test on different backgrounds

Consistency

Keep colors consistent:

• Use brand colors
• Limit color palette
• Apply consistently across pages

Accessibility

Consider accessibility:

• Minimum 4.5:1 contrast ratio for text
• Don’t rely on color alone
• Test with color blindness tools

Button Colors

Separate settings for buttons:

• Button background color
• Button text color
• Button hover color
• Border color

See “How to Style Buttons” for details.

• Editor Overview Learn more

• AI Chat Guide Learn more