Skip to main content
Customize your website’s design through Theme settings.

​
Accessing Theme Settings

  1. Open your website in the editor
  2. Go to Settings tab
  3. Click Theme section
Or click the Theme icon in the preview toolbar.

​
Theme Options

​
Typography

Heading Font
  • Select font family for headings (h1-h6)
  • Options: Google Fonts library
Body Font
  • Select font family for body text
  • Options: Google Fonts library

​
Colors

Primary Color
  • Main brand color
  • Used for buttons, links, accents
Secondary Color
  • Supporting accent color
  • Used for highlights, badges
Background Color
  • Page background
  • Section backgrounds
Text Color
  • Default text color
  • Headings and body text

​
Buttons

Roundness
  • Corner radius
  • Options: None, Small, Medium, Large, Full
Button Color
  • Background color of buttons
Button Hover Color
  • Color when hovering
Button Text Color
  • Text inside buttons
Border Thickness
  • Button border width
  • Options: None, Thin, Medium, Thick
Border Color
  • Button border color
Link Color
  • Color of text links
Link Hover Color
  • Color when hovering over links

​
Applying Changes

  1. Adjust settings
  2. Preview updates in real-time
  3. Click Save to apply

​
Tips

​
Color Harmony

  • Use complementary colors
  • Maintain contrast for readability
  • Test in both light and dark modes

​
Font Pairing

Good combinations:
  • Heading: Playfair Display / Body: Open Sans
  • Heading: Montserrat / Body: Lato
  • Heading: Poppins / Body: Inter

​
Button Consistency

  • Use same style throughout
  • Ensure hover states are visible
  • Test on all backgrounds

​
Quick Changes via AI

Instead of manual settings: 
Change the primary color to purple

Make all buttons rounded with a hover animation

Use Montserrat for headings and Inter for body text

Editor Overview

Learn more

AI Chat Guide

Learn more