Widgets
Configuration
Mixer

Mixer Widget Configuration

The Mixer widget allows users to blend colors directly on your website. This guide will walk you through the configuration options for the Mixer widget.

Mixer Widget Example

Here's an example of how the Mixer widget looks when embedded:

Configuration Process

Follow these steps to configure your Mixer widget:

Access Widget Configuration

Navigate to your account page and click "Create Widget" or go directly to https://trycolors.com/configure-widget (opens in a new tab).

Set Widget Name

Enter a name for your widget. This will only be displayed in your account settings.

Specify Domain

Enter the domain where the widget will be embedded. Use the format http:// or https:// followed by your domain name (e.g., website.com). For subdomains, use https://subdomain.domain.com. Local development is supported with http://localhost.

  • No folders or trailing slashes are allowed in the domain field.
  • Ports are not required and should not be included.
  • Both production domains and localhost for local development are supported.

Ensure the domain is correctly specified to avoid embedding issues. Double-check that you've entered it exactly as it appears in your browser's address bar, minus any paths or ports.

If the domain is not in the correct format or the name field is empty, the "Create" or "Update" button will be disabled, and the incorrectly filled fields will have a red border. Ensure all required fields are correctly filled to enable the button.

Select Widget Type

Choose "Mixer" as the widget type.

Choose Mixer Mode

Select either PRO or Basic mixing algorithm. For more information, refer to the Mixer Mode documentation.

Set Tinting Strength Mode

Choose between Uniform or Adjusted tinting strength calculation. See the Tinting Strength Mode documentation for details.

Select Language

Choose the language for the widget UI: English, French, Romanian, Spanish, German, Russian, Chinese, or Japanese. This affects buttons and labels, not color names.

Choose Palette

Select one of your starting palettes for the widget. If you haven't created a custom palette, refer to the Starting Palette documentation.

Review and Create/Update

Review your settings in the real-time preview on the right side of the page. Click "Create" for a new widget or "Update" for an existing one.

Copy Embed Code (Business accounts only)

After creation, Business account users will see a textarea with the embed code. Copy this code to embed the widget on your website.

Take advantage of the real-time preview to ensure your widget looks and functions exactly as you want before creating or updating it.

Next Steps

For any questions or support regarding Mixer widget configuration, please contact our support team (opens in a new tab).

OverviewUnmixer