Similar Paints Widget Configuration
The Similar Paints widget helps users find paints that closely match a target color. This guide will walk you through the configuration options for the Similar Paints widget.
Similar Paints Widget Example
Here's an example of how the Similar Paints widget looks when embedded:
Configuration Process
Follow these steps to configure your Similar Paints 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
localhostfor 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 "Similar Paints" as the widget type.
Choose Paint Brands and Series
Click on this field to open a modal where you can select one or multiple brands and their series. The widget will search for similar paints only within the selected brands and series. If none are chosen, it will search all Trycolors brands.
We can add your own brand to trycolors.com, making it visible to all Trycolors users in the paints module. This also allows you to narrow the search to only your brand's paints. Please contact us for more information on adding your brand.
Set Default Target Color
Enter a hex code in the format #RRGGBB for the default target color. This color will be pre-set for users when they use the widget. Users can change this by clicking the "Target" button in the widget.
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.
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
- Learn how to install your widget on your website
- Explore advanced widget usage for more complex integrations
- Check out our other widget types: Mixer, Unmixer, and Guess Mix Game
For any questions or support regarding Similar Paints widget configuration, please contact our support team (opens in a new tab).