Use custom images
Variant swatches
Last updated
Variant swatches
Last updated
Theme retirement | Context is no longer available on the Shopify theme store. Theme support and updates for current users will end after May 18, 2024. Learn more here.
Using custom images for swatches is great for product variants that have patterns or textures. Custom swatch images require image file names and variant names that match, which we will cover below.
Adding custom swatches images involves two general steps: (1) Create and upload your custom swatch images and (2) Set up your product variants with matching names.
For each product variant, you need to create a PNG image by screenshotting or cropping your product images. Each swatch image needs a file name that matches the variant name in your product options.
For example, if the product variant is called "Sea Blue", the swatch image file must be named sea-blue.png
.
If your store uses multiple languages, make sure to upload swatch images with file names that match the translated name of your product variants, for each language.
For example, if your store uses English and German, you need two swatch image files for the default variant name (yellow.png
) and the translated name (gelb.png
).
Once you've uploaded your images, you need to set up your product variants with names that match the file names of your swatch images.
Related links Enable swatches Use default color swatches