Install on Shopify

Docs · Store setup & orders

Swatch palettes

Create reusable material and color samples for Image swatch properties, with named photos that match your option values.

Last updated

A Swatch palette is a named collection of option names and sample images. It lets an Image swatch property show the texture or finish of a material instead of a plain color dot.

For example, a palette called “Leather” can map “Green” to a close-up of green leather. Shoppers see the grain and surface of the material before choosing it.

Create and connect a palette

  1. Open Swatch palettes in JUNO and create a palette with a descriptive name, such as “Merino wool” or “Nappa leather”.
  2. Add sample images from your Shopify Files and name each entry after the option value it represents.
  3. In the template editor, add or select an Image swatch property.
  4. Link the property to the appropriate Shopify option, or supply its values manually.
  5. Choose the palette in Swatch palette. Review the coverage information and fill any missing samples.
  6. Preview the selector on each product that uses it.

Match names carefully

JUNO matches an option value to a palette entry by name, ignoring capitalization and surrounding spaces. “Hunter Green” and “hunter green” match; “Hunter-green” is a different name.

Use an explicit palette when the same color name means different materials. “Cognac” in a leather palette can have a different image from “Cognac” in a thread palette. With no palette selected, the property looks across the store’s swatches, which can be ambiguous when names repeat.

Swatch photos belong in the palette. Update an image there to keep the sample consistent wherever that palette is used.

Handle missing samples

The Image swatch property’s Colour fallback setting allows a recognized color name to appear as a color dot when no sample image matches. Turn it off when a plain color would misrepresent the material, then add the missing photo. Unmatched values can otherwise show a placeholder.

A template can read new Shopify option values automatically, but it cannot invent a photograph for a new material. Recheck palette coverage when your catalog changes.

Frequent uses

  • Leather colors where grain or finish matters.
  • Fabric collections with different weaves or patterns.
  • Wood finishes, stone samples and upholstery materials.
  • Separate palettes for components that share color names but look different.

Use Product views for full product photos. Use Design sets for artwork shoppers place on the product.