Skip to main content
Agency Program Get 2× more leads and save 50% on hosting. Built for agencies ready to grow. Book a call
Variation Swatches for WooCommerce icon

Variation Swatches for WooCommerce

v2.2.1
by Emran Ahmed · 4.8 (898 reviews)

Beautiful Color, Image and Buttons Variation Swatches For WooCommerce Product Attributes

300K+ active installs Updated Sep 11, 2025 Tested to 6.8.3 Requires PHP 7.4
Try Demo Download
Pre-installed Ready in ~10s No card
Variation Swatches for WooCommerce

About Variation Swatches for WooCommerce

WooCommerce Variation Swatches is a plugin that allows customers to easily select product options using swatches, images, and labels instead of dropdown menus. It seamlessly integrates with popular WordPress themes and offers a range of customization options. The plugin also includes premium features such as multi-color swatches, the ability to show swatches on shop pages, and the option to change the swatch type for different attributes.

Screenshots

Variation Swatches for WooCommerce screenshot
Variation Swatches for WooCommerce screenshot
Variation Swatches for WooCommerce screenshot
Variation Swatches for WooCommerce screenshot
Variation Swatches for WooCommerce screenshot
Variation Swatches for WooCommerce screenshot
Variation Swatches for WooCommerce screenshot
Variation Swatches for WooCommerce screenshot
Variation Swatches for WooCommerce screenshot
Variation Swatches for WooCommerce screenshot
Variation Swatches for WooCommerce screenshot
Variation Swatches for WooCommerce screenshot

Frequently asked questions

How To Install Product Variation Swatches Plugin for WooCommerce Variable Products
Variation Swatches is easy to use WooCommerce product variation swatches plugin. It offers an aesthetic and professional experience to select attributes for variation products. It turns the product variation select options fields into radio images, colors, and label. It means with the help of this powerful WooCommerce color or image variation swatches plugin, you can show product variation items in images, colors, and label. So, you can say goodbye to dropdown product attribute fields.
How To Create Product Variation Swatches From Custom Product Level Attribute
The Variation Swatches plugin also allows you to change your globally added color. You can insert new color replacing globally added color in color variation swatches for each product.
How To Show WooCommerce Variation Swatches on Shop Page
Besides adding swatches on the product page, you can show WooCommerce variation swatches on the shop page
How To Show WooCommerce Variation Swatches on Shop Page
Besides adding swatches on the product page, you can show WooCommerce variation swatches on the shop page
How To Show WooCommerce Variation Swatches on Shop Page
Besides adding swatches on the product page, you can show WooCommerce variation swatches on the shop page

Changelog

2.2.1 – 11-09-2025

  • Fixed: Composite product re-insert label issue.
  • Added: WP 6.8+ compatibility.
  • Added: WC 10.1+ compatibility.

2.2.0 – 16-02-2025

  • Fixed: Broken Settings html table.
  • Added: Lazy Loading on swatches images to improve performance.

2.1.3 – 11-12-2024

  • Fixed: JS Setting update warning trigger issue.
  • Added: WP 6.7+ compatibility.
  • Added: WC 9.4+ compatibility.

2.1.2 – 29-08-2024

  • Added: WooCommerce 9.2+ Compatibility.
  • Added: Admin Menu “Clear swatches transient”.

2.1.1 – 02-07-2024

  • Fixed: Attribute meta save issue.
  • Update: WooCommerce 9.0+ Compatibility.

2.1.0 – 06-06-2024

  • Fixed: PHPCS Issues.
  • Updated: Add 3rd param to get_swatch_data() method.
  • New: wpml-config.xml file added to support WPML.
  • Update: WooCommerce 8.9+ Compatibility.
  • Update: Modify theme support feature. to woo_variation_swatches. Example: add_theme_support( 'woo_variation_swatches', array( 'enable_stylesheet' => 'no', 'enable_tooltip' => 'no' ) ); for theme developer default setting control.

2.0.31 – 23-04-2024

  • Update: WordPress 6.5+ Compatibility.
  • Update: WooCommerce 8.8+ Compatibility.

2.0.30 – 15-01-2023

  • Update: WooCommerce 8.4+ Compatibility.

2.0.29 – 21-11-2023

  • Update: WordPress 6.4+ Compatibility.
  • Update: WooCommerce 8.3+ Compatibility.

2.0.28 – 25-10-2023

  • Fix: Hide disabled variation attributes

2.0.27 – 18-10-2023

  • Fix: Block variation product add to cart
  • Fix: Select2 hover css issue fixed.
  • Update: WooCommerce 8.2 Compatibility.
  • Add: Filter added: woo_variation_swatches_remove_attribute_item and woo_variation_swatches_get_swatch_data

2.0.26 – 05-09-2023

  • Fix: All import plugin issue.

2.0.25 – 31-08-2023

  • Add: WordPress 6.3 compatibility
  • Add: WooCommerce 8.0 compatibility
  • Update: Color / Image data can update by API Request

2.0.24 – 05-07-2023

  • Fix: Bundle product radio attribute issue.

2.0.23 – 18-06-2023

  • Update: WooCommerce 7.8 Compatibility
  • Fix: API Issue

2.0.22 – 11-06-2023

  • Fix: Tooltip width issue

2.0.21 – 02-06-2023

  • Update: WooCommerce 7.7 Compatibility
  • Update: Responsive tooltip
  • Add: Additional rest api response
  • Add: Filters to modify attribute template response

2.0.20 – 13-04-2023

  • Fix: Product children check issue
  • Update: WP 6.2 Compatibility

2.0.19 – 16-03-2023

  • Add: High-Performance order storage (COT) feature compatibility.
  • Fix: Variation cache cleaning issue.
  • Update: WC 7.5 Compatibility

2.0.18 – 18-01-2023

  • Update: caching function
  • Update: WC 7.3 Compatibility

2.0.17 – 06-01-2023

  • Add: show product variation image if image type attribute have no image selected
  • Fix: clearing transient after attribute update

2.0.16 – 13-12-2022

  • Fix: litespeed-cache plugin trigger error to use WP_Object_Cache::flush_group method

2.0.15 – 12-12-2022

  • Fix: Object cache issue

2.0.14 – 06-12-2022

  • Fix: Variation delete error

2.0.13 – 17-11-2022

  • Update: Performance Improvement

2.0.12 – 31-10-2022

  • Update: Update Migration Script
  • Update: Modify woo_variation_swatches_variable_item_custom_attributes filter

2.0.11 – 28-09-2022

  • Update: WooCommerce Support

2.0.10 – 15-09-2022

  • Update: WooCommerce Support
  • Update: JS Scripts
  • Fix: WPML Option issue

2.0.9 – 28-08-2022

  • Update: Translation String
  • Update: Settings Script and RTL

2.0.8 – 17-08-2022

  • Fix: Caching header issue

2.0.7 – 11-08-2022

  • Update: Woocommerce 6.8 support
  • Add: Caching header for ajax response

2.0.6 – 31-07-2022

  • Fix: dependency script updated for product page settings save issue
  • Update: is_admin() check removed for some theme support

2.0.5 – 20-07-2022

  • Add: woo_variation_swatches_html filter to modify swatches output
  • Add: woo_variation_swatches_nav_widget_html filter to modify widget output
  • Update: [wvs_show_archive_variation] shortcode updated, now product_id can be added like: [wvs_show_archive_variation product_id="ID"].
  • Update: data-dependency attribute to data-gwp_dependency for possible conflict.
  • Update: translation string.

2.0.4 – 08-07-2022

  • Fix: Composite Product Selecting Issue
  • Add: Option to change tick and cross icon color
  • Add: Option to enable/disable preloader

2.0.3 – 26-06-2022

  • Fix: Out of Stock info

2.0.2 – 23-06-2022

  • Add: Image type fallback if no attribute image added.
  • Fix: Archive add to cart issue
  • Add: Ajax Quick View / Load More support

2.0.1 – 16-06-2022

  • Add: Hex to RGBA color conversion on migration
  • Fix: Disable attribute hide css issue.
  • Fix: variation selected css issue.

2.0.0 – 13-06-2022

  • Update: plugin structure change and add more features.

1.1.19 – 07-09-2021

  • Fix: show_option_none value

1.1.18 – 06-09-2021

  • Update: WooCommerce and WordPress Compatibility
  • Fix: Bundle Product selected issue

1.1.17 – 08-05-2021

  • Update: Update PHP functions

1.1.16 – 03-05-2021

  • Fix: Backend CSS

1.1.15 – 24-04-2021

  • Fix: WPML currency switcher issue.
  • Add: Function added to get Dual color values

1.1.14 – 11-04-2021

  • Fix: WPML product term meta issue.
  • Update: Backend CSS

1.1.13 – 10-03-2021

  • Add: WooCommerce and WordPress Compatibility
  • Update: Remove _.contains and replace with _.includes

1.1.12 – 02-03-2021

  • Update: Add UnderscoreJS on script dependency

1.1.11 – 01-03-2021

  • Fix: WooCommerce Composite Products selection issue
  • Update: Swatch support for Global Ajax complete event
  • Update: Swatches Markup Modified
  • New: Disable WoodMart theme default swatches

1.1.10 – 16-02-2021

  • Fix: Error when woocommerce not available

1.1.9 – 12-02-2021

  • Fix: no_cache header modification issue

1.1.8 – 08-02-2021

  • Fix: RTL label css
  • Update: Load scripts globally

1.1.7 – 01-02-2021

  • Support: WooCommerce Composite Product

1.1.6 – 27-01-2021

  • Update: Extended note on Performance Section

1.1.5 – 13-01-2021

  • Update: Remove wp_ajax_wvs_get_available_variations hook

1.1.4 – 12-01-2021

  • Fix: WC_Cache_Helper::invalidate_cache_group() method issue.

1.1.3 – 10-01-2021

  • Update: Use WC_Cache_Helper for template caching
  • Update: Support Latest WP and WC

1.1.2 – 26-11-2020

  • Fix: Customizer JS Issue.

1.1.1 – 16-11-2020

  • Update: WooCommerce 4.7 compatibility

1.1.0 – 27-10-2020

  • Add: Selected attribute name beside label
  • Update: Support WooCommerce 4.6 version
  • Update: Accessibility

1.0.86

  • Update: Support WooCommerce 4.4 version
  • Update: Support WordPress 5.5 version
  • Fix: Alpha color channel issue

1.0.85

  • Update: Support WooCommerce 4.3 version

1.0.84

  • Add: wvs-no-css will add on when stylesheet disabled. wvs-css will add on when stylesheet enabled, wvs-no-tooltip will add on when tooltip disabled, wvs-tooltip will add on when tooltip enabled.

1.0.83

  • Update: Remove CSS Selector from body tag.

1.0.82

  • Add: Filter wvs_product_global_attribute_image_id to modify attribute image.
  • Add: Variation attribute image preview based on availability.

1.0.81

  • Fix: User select issue on firefox mobile.

1.0.80

  • Add: WordPress 5.4 compatibility
  • Fix: Default image for quote attribute value.

1.0.79

  • Fix: Rollback some features to 1.0.76 to fix a known issue.

1.0.78

  • Fix: Attribute behavior: Hide issue

1.0.77

  • Add: WooCommerce 4.0 compatibility
  • Fix: Facebook for woocommerce issue.
  • Divi theme css issue fix.

1.0.76

  • Fix: settings option php notice.

1.0.75

  • Fix: mobile double tab clear issue.

1.0.74

  • Fix: tooltip issue.

1.0.73

  • Fix: QuickView issue

1.0.72

  • Add: Namespace on themes events
  • Fix: WooCommerce Product bundle Issue.

1.0.71

  • Update: Tooltip transform
  • Fix: Field Dependency Js Load

1.0.70

  • Fix: Divi builder load issue.
  • Fix: Default selected tooltip Issue.
  • Update: Field Dependency css.

1.0.69

  • Update: Disable Defer JS Load by Default and on mobile device.

1.0.68

  • Fix: WooCommerce transients clear fix

1.0.67

  • Fix: Swatch Image Size CSS Issue

1.0.66

  • Fix: Simple product Issue

1.0.65

  • Add: Speed Improvement

1.0.64

  • Fix: Mobile Scroll Issue

1.0.63

  • Add: Select attribute set type button by default.
  • Fix: Transients issue.

1.0.62

  • Add: WC 3.7 update

1.0.61

  • Fix: CSS source map issue.

1.0.60

  • Fix: Clear selection js error fix.

1.0.59

  • Add: Dokan Multivendor Support added

1.0.58

  • Fix: Inactive WooCommerce notice
  • Fix: Known Issues

1.0.57

  • Fix: Some known issues
  • Add: WordPress 5.2 Compatibility

1.0.56

  • Fix: Language load
  • Add: FacetWP Load More Option
  • Add: WooCommerce 3.6 update

1.0.55

  • Add: Oxygen Theme Support CSS

1.0.54

  • Fix: Load Assets without CDN.
  • Remove: Product Page popup attribute

1.0.53

  • Fix: IE 11, CSS flexbox issue

1.0.52

  • Add: Yith Product filter support

1.0.51

  • Add: Flatsome theme Infinite Scroll Support
  • Fix: Massive Dynamic theme CSS Issue

1.0.50

  • Fix: Archive more click issue.
  • Add: Adiva Theme support.

1.0.49

  • Fix: Gecko theme support
  • Add: Set default Shape style to Squared Shape

1.0.48

  • Fix: Some speed issue.

1.0.47

  • Add: Filter disable_wvs_body_class to disable or enable body class.

1.0.46

  • Add: Filter disable_wvs_enqueue_scripts to disable or enable enqueuing scripts.
  • Add: Filter disable_wvs_inline_style to disable or enable inline style.

1.0.45

  • Fix: WC 3.5 Issue

1.0.44

  • Add: IE-11 Support
  • Add: Exporter-Importer

1.0.43

  • Fix: Uncode theme Issue

1.0.42

  • Fix: JS Reload variation.

1.0.41

  • Fix: uShop by themetim CSS Issue

1.0.40

  • Improve: Live Feed

1.0.39 and 1.0.39.1

  • Fix: Elementor Pro CSS Issue

1.0.38

  • Remove: Pro Class from Settings

1.0.37

  • Add: RTL Support
  • Fix: The Gem Theme CSS Issue

1.0.36

  • Add: Yith Infinite Scroll support
  • Fix: Yoast SEO Focused keyword issue.

1.0.35

  • Add: AURUM theme support
  • Fix: WooCommerce Product Bundle conflict.

1.0.34

  • Fix: Known JS Issue

1.0.33

  • Fix: CSS Issue

1.0.32

  • Add: Out of stock product crossed also if “Hide out of stock items from the catalog” unchecked.

1.0.31

  • Add: Kalium theme css fix

1.0.30

  • Add: body class uniqueness
  • Add: Centralise feed
  • Fix: Elementor Pro JS Issue

1.0.29

  • Add: IE-11 fallback
  • Add: Increase variation_threshold label
  • Fix: Divi woo_layout_injector script override

1.0.28

  • Add: Admin Notice CSS

1.0.27

  • Add: SelectBox class for more control
  • Add: StockHolm Theme Compatibility

1.0.26

  • Improve: Tooltip
  • Add: Enfold Theme Compatibility

1.0.25

  • Add: gwp_affiliate_id Filter for Affiliate link ID in more place.

1.0.24

  • Improve: Frontend Visual Appearance
  • Fix: Some known issues

1.0.23

  • Improve: Frontend Visual Appearance
  • Add: Flatsome Theme shortcode override

1.0.22

  • Add: OceanWP Theme Compatibility
  • Add: Sober Theme Compatibility
  • Add: Shophistic Lite Theme Compatibility
  • Add: Old Haven Theme Compatibility

1.0.21

  • Fix: Known JS Issue
  • Fix: Tooltip disable item disable issue
  • Add: gwp_affiliate_id Filter to add affiliate referral link

1.0.20

  • New: Font Size settings
  • Improve: Frontend Visual Appearance

1.0.19

  • New: Size settings
  • Improve: Visual Appearance

1.0.18

  • Update: CSS
  • New: Attribute behaviour

1.0.17

  • Fix: Visual CSS Issue

1.0.16

  • Update: Improve JS Functionality
  • Update: Multisite Compatibility

1.0.15

  • New: Attribute deselect option
  • Fix: Custom attribute select from product
  • Update: translation

1.0.14

  • New: Support Jetpack’s Infinite Scroll event, post-load event.
  • New: wvs_product_attribute_image_size filter to change attribute image size
  • New: Increased tooltip z-index

1.0.13

  • Fix: Avada theme select issue

1.0.12

  • Fix: Disable publish button issue

1.0.11

  • New: Attribute create from product
  • New: Variation Preview color, image
  • New: Settings option also added on customizer
  • Fix: Any variation issue caused by Out-of-Stock variation

1.0.10

  • New: Extendable hooks added to extend
  • New: ajax variation threshold option added to control ajax variation.
  • Fix: Out Of Stock Product Issue.

1.0.9

  • Fix: Merged Pull request from spoyntersmith
  • Fix: Tooltip hardware acceleration issue fix for theme animation
  • Fix: use jquery sibling instead of prev

1.0.8

  • Update: Improve variation javascript to support ajax variation
  • Update: Renamed tooltip attribute to resolve conflict
  • Update: Renamed variation javascript class name

1.0.7 – 2018-01-21

  • Update: Improving frontend CSS
  • Update: Disable Bootstrap tooltip conflict

1.0.6 – 2018-01-19

  • Update: translation

1.0.5 – 2018-01-19

  • Fix: backend js issue

1.0.4 – 2018-01-17

  • Fix: Number Select Issue

1.0.3 – 2018-01-15

  • New: Css class on body based on settings
  • Update: tooltip and frontend css changed
  • New: add_theme_support( 'woo-variation-swatches', array( 'tooltip' => FALSE, 'stylesheet' => FALSE ) ); for theme developer default setting control.
  • New: wvs_clear_transient to clear saved transient.

1.0.2 – 2018-01-08

  • New: attribute tooltip
  • New: Default stylesheet enable/disable option
  • New: Display style added to show Rounded / Squared shaped style

1.0.1 – 2017-12-23

  • Fix: text type select list

1.0.0 – 2017-12-20

  • Initial release

Try other plugins

Yoast SEO icon

Yoast SEO

4.8 · 10M+ installs

Improve your WordPress SEO: Write better content and have a fully optimized WordPress site using the Yoast SEO…

LiteSpeed Cache icon

LiteSpeed Cache

4.8 · 7M+ installs

All-in-one unbeatable acceleration & PageSpeed improvement: caching, image/CSS/JS optimization...

WooCommerce icon

WooCommerce

4.5 · 7M+ installs

Everything you need to launch an online store in days and keep it growing for years. From your…