Color swatches for every Shopify theme.

Native swatches start with a product category. Shopify's categories come from its Standard Product Taxonomy, and choosing one adds a set of attributes to the product, which Shopify calls category metafields. One of those attributes is Color.

When you link a variant option to the Color category metafield, the option's values come from color entries instead of free text. Each entry is reusable: edit it once in Content > Metaobjects and every product linked to it changes. Shopify's own example is renaming black to graphite across a whole catalog.

Already have products with a Color option? You don't have to rebuild them. Open the option, use the connect icon beside its name and pick the Color category metafield.

Plain Color is the common one, but Shopify lists 55 color attributes that can carry swatches, including Band color, Dial color, Frame color, Lens color and Upholstery color. Pick a category that includes the attribute you need. Custom attributes aren't supported (Shopify Help Center, checked October 23, 2026).

Each color entry can hold a hex value, an image, or both. Themes read them through Liquid's swatch object, which has a color and an image. Use images for stripes, prints, wood and other patterns.

Multicolor has no preset hex value, so give it an image. In collection filters, themes often show the image when an entry has both.

Shopify's data is only half the job: the theme has to draw it. In themes that support swatches, the variant picker block shows them by default once an option is linked, and Shopify's general steps offer Circle, Square or None as the display. Every theme names these settings a little differently, which is why each theme has its own page here.

• Theme Store themes must support swatches on product options, showing either a hex color or an image.
• Dawn has supported them since version 13 (Winter '24 Edition), and Shopify says category-based swatches need the latest Dawn.
• Vintage themes, such as Debut and Brooklyn, need code edits or a Shopify Partner.

Shopify's swatch help covers two places: the product page's variant picker and collection filters. Swatches on product cards in a collection grid are up to the theme, and the Theme Store rule covers product options only.

For filters, open the Search & Discovery app, add a Color filter with the type Category metafield, and turn on Include swatch (or Use images when available for patterns) under Manage values. The theme has to support Shopify's filter value API to draw them. Automatic grouping puts shades such as burgundy and ruby under Red, and Reorder for me sorts swatch values around the color wheel.

• Swatches only appear for options linked to a color category metafield.
• A product can have up to three options and 2,048 variants.
• Shopify's help pages disagree on whether category attributes work in Search & Discovery and Shopify Bundles. Filters work in Shopify's own swatch tutorial; treat Bundles as unsupported and test your filters.
• A new category may not suit every sales channel, so check a published product's channels before you change its category.