Skip to main content
Design profiles define the visual foundation for generated pages — typography, colors, spacing, and section styling. They’re used in the Brief Wizard and Commercial Pages to render visual previews and Elementor output.

Profile Settings

Typography

  • Heading font — Font family for all headings (H1–H6)
  • Body font — Font family for paragraph text
  • Font pairings are selected from a curated set of web-safe and Google Fonts options

Color Palette

  • Primary color — Main brand color used for headlines, buttons, and accents
  • Secondary color — Supporting color for section backgrounds and highlights
  • Accent color — CTA buttons, links, and interactive elements
  • Background colors — Light and dark section backgrounds
  • Card backgrounds — Colors for feature cards, testimonial cards, etc.

Layout

  • Section spacing — Vertical padding between sections (compact, medium, spacious)
  • CTA style — Button appearance (rounded, pill, square, outlined)
  • Section decorations — Dividers, gradient overlays, glow effects between sections

Usage

Design profiles are applied during:
  • Brief Wizard preview — The live preview renders with your typography, colors, and spacing
  • Elementor output — When exporting to Elementor, the design profile maps to container styles and widget settings
  • Section template selection — The profile influences which visual templates are available for each section type

Tips

  • Create multiple design profiles if you serve different brands or page types
  • Test your color palette for accessibility — ensure sufficient contrast between text and backgrounds
  • Preview your profile in the Brief Wizard before committing to a full page generation