Smart Variation Swatches for WooCommerce Pro lets shoppers choose variable product options through color swatches, image thumbnails, text labels, or form-style controls. Use visual choices when clients benefit from seeing colors, patterns, or styles at a glance, and keep a dropdown when a list is the clearest fit.

Choose a display for each attribute

• Color: Assign hex-based colors to attribute terms and show them as circles or squares.
• Image: Upload thumbnails for patterns, fabrics, finishes, styles, or product photos.
• Button/Label: Show short text options such as sizes, materials, or pack types.
• Select: Retain the native dropdown for attributes that fit a list.
• Radio and Checkbox: Use these Pro attribute types for form-style choices.

Product choices and catalog browsing

Global attribute settings help keep shows consistent across the shop. Product-level configuration and Pro overrides support products with one attribute or several. On shop and category pages, advanced archive options give you more control over where and how swatches appear. The enhanced filter widget lets users filter by color, image, and other attributes through a swatch interface in sidebars and widget areas.

Apply swatches to different catalogs

For apparel, pair color swatches with text labels for sizes. Beauty stores can use color terms for shades, while furniture, wallpaper, fabric, and phone-case catalogs can use image attributes to show patterns or finishes. These options also suit products in electronics and other categories where shoppers compare variations.

Set up attributes and product variations

Install and activate Smart Variation Swatches for WooCommerce Pro, then open Variation Swatches → Dashboard for an overview. Go to Products → Attributes and choose a type such as Color, Image, Button/Label, Radio, or Checkbox. Configure the attribute terms and assign colors or upload pictures where applicable. Add the attribute to variable products before creating their variations.

Use Variation Swatches → Settings to adjust styles and tooltips. Controls include shape, size, spacing, borders, button colors, out-of-stock display styles, and the option to hide the original dropdown. The extension works with most WooCommerce-ready themes; highly customized variation templates may need light CSS or template adjustments.