Magento 2 Color Swatches: How To Configure It?

Here are the following steps which show you how to configure color swatches in Magento 2:

1. Text-based swatches
2. Swatches in Layered Navigation

Build your Amazon-like multi-vendor marketplace website @ $249/- now!!!

           Get your free live demo now: Click here

It is vital to offer the true aspects of the items by swatches features in Magento such as color, pattern, and texture because consumers only base the senses to make a decision and decide whether they will buy the product or not in shopping online.  If the customers feel practical, you might sell out more products.

To exhibit consumers the variety of patterns or colors of your product, Color Swatch is a good solution for configurable products. In addition, the swatches of the product are shown on the product detail page and the catalog page on the store view, as the following:

Text-based swatches in Magento 2

A text-based will emerge instead of true color and perform in the same way as a swatch with an image if you did not set a particular image for a color swatch.

Any size that is not available is crossed out when text-based swatches are used to explain the available sizes.

Swatches in Layered Navigation

In the layer navigation, the swatches containing text-based swatches as well as color swatches may be also used.

Configure color swatches in Magento 2

Step 1: Built the swatches

Step 2: Update your product

Built the swatches

To build the swatches, you should apply one of the following methods:

• Add a color swatch
• Upload a swatch image

Method 1: Add colour swatches

• For your product, you may recognize the exact color.
• You may navigate to Admin sidebar, you may select stores, you may select Attributes, then choose
• You may find and edit the color attribute in the grid.
• To visual swatch, you may choose Catalog Input Type for Website Owner.
• To join a new definition to the bottom of the list, you might select Add swatch under Manage Swatch. Then, you may do the following:
• You may click on to choose a color on the swatch men
• You may enter the six numbers that symbolize the hexadecimal value of the new color in the #field in the color picker, and to delete the current value, you can choose the Backspace key. Then to save the swatch, in the lower-right corner, you can select Color Wheel Button.
• In the Admin and Default store view, you can enter the label for the color.
• To set the default color as you need, you can mark the checkbox under the Is Default.
• You may select Save Attribute when you complete, then in the Cache management tab, you may flush the cache.
• Finally, you may go to Edit mode in each product, and with the correct swatch, you may update the color attribute. You may follow the steps below to update all products at the same time.

Method 2: Upload a Swatches Image

• You may collect the swatch image that is right for your product.
• You may go to the Admin sidebar, click Stores, then you select Attributes, and choose Product.
• You may find and edit the Color attribute in the grid.
• To Visual Swatch, you may set Catalog Input Type for the Website Owner.
• To insert a new definition to the bottom of the list, you may click on Add Swatch under Manage Swatch. Then, you may do the following:
  • You may choose to upload a file on the swatch menu on the swatch menu.

• • From your computer, you may select the desired image.
  • For other swatch images, you can repeat these steps.
  • In the Admin and Default Store View, you may enter the label for the color.
• In the Cache Management tab, you may click on Save Attribute when complete, and then you may remember to flush the cache.
• Finally, you may go to Edit mode in every product, and with the right swatch, you may update the Color attribute. Moreover, you may follow the steps below to update multiple products at the same time.
• You may go to the Admin sidebar, then you may click Products, then choose Inventory, you may select Catalog.
• To involve only the applicable products, you might filter the list by Name or SKU.

• You may mark the checkbox of every product that you want the swatch to apply. Then, you may set the Actions control to Update Attributes.

• You may look down to the Color attribute, and then you may mark the Change checkbox.

I hope the following steps help you  How to configure colour swatches in Magento 2. Find more Magento tutorials by our Experts.

Build your online store with Magento 2 platform including all eCommerce related features.