How to configure When creating a new attribute, select the “Color swatches” template. And make sure you have type “Color” selected.
Next, you can choose to set a style. Like rounded or squared. Or you can inherit from theme. You could even override the border radius there to a custom value. Custom styles should go in the Custom CSS field. You can also choose to show or hide tooltips. When you select “Show tooltip” you will see the label and price of the attribute when you hover over the color with your mouse. Example We have created a demo product that showcases the color swatches attribute in action. Click the button below to see a live demo. Product add-on: Color swatches