How to create custom color swatches for your Shopify products

Many of Shopify's premium themes allow you to add custom color swatches, which are often more accurate than the default color swatches. 

This requires creating a small image for each color swatch. The swatch image should be 50x50 pixels, and saved in PNG format.

The swatch image file name must have the exact same name as the color, all in lowercase, and have all spaces replaced with a dash (-). For example, a color swatch image for the color "Black Camo" would have the file name "black-camo.png"

To make the color swatches appear on your products, the color swatch image files need to be uploaded to the theme assets folder of your theme code files.

Need help? Hire a Shopify Expert to create custom color swatches for your Shopify products: Buy a Shopify Custom Task now!

Back to blog