Products & Surfaces

AI-powered theme generation

Generate a chat widget theme automatically from your website URL or a written description. Runtype’s AI analyzes your inputs and creates matching styling.

How AI theming works

The AI theme generator:

  1. Analyzes your website or brand inputs
  2. Extracts colors, fonts, and design patterns
  3. Generates a complete widget theme
  4. Applies styling automatically

You can further customize the generated theme using the standard theming tools.

Generate from website URL

  1. Open your chat Surface
  2. Go to the Ship tab
  3. Click Generate Theme
  4. Select From Website
  5. Enter your website URL
  6. Click Generate

The AI visits your site, analyzes the design, and applies matching colors and fonts to the widget.

Generate from a description

If you don’t have a website to point at, describe the look you want in plain language:

  1. Click Generate Theme
  2. Switch to Describe mode
  3. Type a description of the style you want, for example “A dark theme with purple accents and rounded corners”
  4. Optionally attach reference images
  5. Click Generate

The AI turns your description (and any reference images) into a matching color scheme, fonts, and spacing.

Generation options

Customize how the theme is generated:

  • Style preference — Modern, classic, vibrant, or minimal
  • Contrast level — High contrast for accessibility or subtle for elegance
  • Font matching — Use website fonts or select generic alternatives

Review and refine

After generation:

  1. Preview the theme in the preview panel
  2. Review colors, fonts, and spacing
  3. Make manual adjustments if needed
  4. Click Apply Theme

The generated theme becomes your starting point—you can modify any aspect using Widget theming and customization.

AI theming works best with established websites that have clear branding. For new Products, manually select colors or use a template instead.

Regenerate themes

You can regenerate at any time:

  1. Click Generate Theme again
  2. Choose new inputs or options
  3. Compare with current theme
  4. Apply if preferred

Previous themes aren’t saved—regenerating replaces your current custom styling.

When to use AI theming

Good for:

  • Matching an existing website’s design
  • Quick setup without manual styling
  • Starting point for further customization

Skip if:

  • You have very specific design requirements
  • Your brand uses complex gradients or patterns
  • You need pixel-perfect control

Next steps