Skip to main content

Design Overview

The Design settings control the visual appearance of your popup, including colors, typography, borders, shadows, and animations.

Design Categories​

Colors & Backgrounds​

Customize colors and backgrounds:

  • Background Color — Solid colors or gradients
  • Background Image — Image backgrounds with positioning
  • Text Colors — Element text colors
  • Link Colors — Hyperlink colors

See Colors & Backgrounds for details.

Typography​

Control text appearance:

  • Font Family — Choose from 500+ Google Fonts
  • Font Size — Text sizing
  • Font Weight — Bold, normal, light
  • Line Height — Line spacing
  • Text Alignment — Left, center, right, justify

See Typography for details.

Borders & Shadows​

Add visual effects:

  • Border — Width, style, color, radius
  • Box Shadow — Drop shadows and elevation
  • Border Radius — Rounded corners

See Borders & Shadows for details.

Animations​

Add motion to your popup:

  • Entrance Animations — How popup appears
  • Exit Animations — How popup disappears
  • Element Animations — Animate individual elements
  • Animation Duration — Control speed

See Animations for details.

Responsive Design​

Design settings can be customized per device:

  • Different colors for mobile
  • Adjusted font sizes
  • Device-specific animations
  • Responsive spacing

See Responsive Design for details.

Custom CSS​

For advanced customization:

  • Add custom CSS classes
  • Override default styles
  • Create unique designs

See Custom CSS for details.