Customizing Website Theme
The Theme panel lets you adjust global styling for consistent design across your website.Opening Theme Panel
Click the Theme button in the right panel area.Theme Options
Color Palette
Define your brand colors:- Primary - Main brand color
- Secondary - Accent color
- Background - Page backgrounds
- Text - Default text color
- Accent - Highlights and CTAs
Typography
Set font styles:- Heading font - For titles
- Body font - For paragraphs
- Font sizes - Scale settings
- Line height - Text spacing
Spacing
Control whitespace:- Section padding - Space around sections
- Element margins - Space between elements
- Container width - Max content width
Border Radius
Round corners:- None - Sharp corners
- Small - Subtle rounding
- Medium - Moderate curves
- Large - Very rounded
- Full - Pill shapes
Shadows
Add depth:- None - Flat design
- Small - Subtle shadow
- Medium - Noticeable depth
- Large - Strong shadow
Applying Theme Changes
Changes apply globally:- Adjust a setting
- Preview updates live
- All matching elements update
- Save to persist
Color Picker
Click any color to open picker:- Visual color selection
- Hex input
- RGB values
- Recent colors
Font Selection
Choose from:- Google Fonts library
- System fonts
- Custom fonts (if uploaded)
Best Practices
Consistency
- Use 2-3 main colors
- Stick to 2 font families
- Maintain spacing rhythm
Accessibility
- Ensure contrast ratios
- Readable font sizes
- Clear visual hierarchy
Brand Alignment
- Match brand guidelines
- Use official colors
- Consistent with other materials
Tips
- Start with colors, then typography
- Preview on multiple pages
- Test on mobile devices
- Save before major changes