Uploading custom color for color swatch

ThemeGoal

Upload an Image to Replace a Color

If standard swatch colors are insufficient, missing, or inaccurate, consider replacing them with your own custom color images.

Gather the color image

Capture or edit a product image to produce a square sample of the variant's color, pattern, etc. For this example, we are cropping a clothing product image to replace a color for the Pacific Print variant.

Format the filename to match variant

The image must be named after the color option in lowercase and formatted as a PNG or JPG.

For one-word names, the formatting is the most straightforward:

If the color is Black, then name your image black.png or black.jpg

For multiple-word names, use hyphens to separate each word:

If your color is named Dark Blue, name the image dark-blue.png or dark-blue.jpg.

Like spaces, slashes and most other special characters are replaced with hyphens:

If your color is Blue/Gray, then name your image blue-gray.png or blue-gray.jpg.

Upload the files

To do that, you will first need to upload an image in the Files section of Shopify (we recommend a 128x128 image, either in PNG or JPG). You can learn more about how to do that here: https://help.shopify.com/en/manual/shopify-admin/productivity-tools/file-uploads

Recently viewed