Skip to main content
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