Customizing widget appearance

Customize how your widget looks and behaves to match your brand and product. Appearance options control colors, positioning, display mode, and visual elements.

Appearance settings

In the widget builder's Appearance section, you can configure:

• Title — Widget heading (required)

• Company logo — Toggle to show your logo in the widget header

• Description — Rich text intro (up to 180 characters)

• Theme — Select a visual theme for the widget

• Header background color — Custom hex color (e.g., #fafafa)

• Header text color — Custom hex color for header text

Launcher customization

The launcher controls how users open your widget. Options include:

• Launcher type — Floating button, tab, selector, or none (for programmatic control)

• Position — Eight positions available (bottom-left, bottom-right, top-left, top-right, and center variants)

• Icon — Choose from 5+ built-in icons

• Color — Custom hex color for the launcher button

• Text — Custom label for the launcher

• Notification badge — Show a badge to draw attention

Display modes

In the View section, choose how the widget appears when opened:

• Popover — Small overlay that doesn't cover the full screen

• Sidebar — Slides in from the side of the screen

• Modal — Full overlay that focuses attention on the widget

• Embed — Inline widget that's always visible on the page

Each mode supports additional options:

• Placement — Where the widget appears relative to the screen

• Size — Width and height in pixels or percentages

• Offset — Distance from screen edges

• Fixed position — Keep the widget in place when scrolling

• Hide close button — Remove the X button

• Prevent scroll — Disable page scrolling while widget is open

Themes and branding

Select a theme that matches your product's design. Each theme includes coordinated colors and styling.

For advanced branding options including custom CSS and white labeling, see Customizing your Frill theme and colors.