Color Swatches

Color swatches are colorful buttons that can be placed on a product page. They replace the traditional drop-down menu and allow customers to ‘click’ on the color button to see the color on the product. 

You can add color swatches to the product on Product detail page in Customizer of theme. For this, on Product detail page choose “Product information" section and click on “Variant picker" block, then select the type “Dropdown” and mark the checkbox “Enable type Button for variant Color” (if dropdown is selected), save your changes.


 *To use this feature, you must have variants of product colors. To add more options for button go to admin panel of the store and choose the page of needed product. Then in options add a new variant and click Save.


In Theme settings find "Color Swatches" to choose different color shades. Check settings below this screenshot. 

1. Enable color swatches (mark checkbox)

To change standard color for color swatches mark this checkbox.

2. Color swatches rules 

Set up the color of your product by typing the correct format. 

Explanation: Format: <Color option>: <value>(separated by lines). The color name must match the variant color option name. Example: Rose Gold: #b76e79 .

3. Color picker

Click on the "Color picker" circle to choose different color shades, for example, shades of red or black colors. Then copy the color number and put it into "Color swatches rules" in the correct format.

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us