WooCommerce’s default variation dropdowns only display plain text, so to show color swatches, image swatches, or custom-styled attributes on a variable product page, you need a dedicated attribute plugin. This article covers the 10 best WooCommerce attribute plugins for variable products, plus how to set up a variable product and its attributes from scratch.
What Is a Variable Product in WooCommerce?
A variable product is a single product listing that offers multiple purchase options, such as different colors, sizes, or materials, so customers can pick a specific combination before adding it to the cart. Each combination, like “Red, Medium,” is called a variation. The option categories themselves, such as color and size, are called attributes. WooCommerce marks every new product as a Simple product by default, so building a variable product means switching that setting and defining the attributes yourself.
How to Create a Variable Product in WooCommerce
Step 1: Add a new product. From your WordPress dashboard, go to Products > Add New, then enter a product name and description.
Step 2: Switch the product type to Variable product. Scroll to the Product data box and use the dropdown at the top to select the Variable product.
Step 3: Create attributes. You can create attributes two ways: from the Attributes tab inside Product data, or from Products > Attributes in the main menu.
Attribute: Local. A custom attribute created inside a single product’s Attributes tab, only usable on that product.
Attribute: Global. An attribute created from Products > Attributes, reusable across every variable product in your store.
To add a local attribute, select Custom product attribute in the Attributes tab, click Add, then enter a name and list your values separated by “|”. To add a global attribute, create it under Products > Attributes, then use Configure Terms to add its values.
Step 4: Add attributes to the product. With global attributes, return to the product’s Attributes tab, select the attribute from the dropdown, choose the values you want to use, and check Used for variations. The Variations tab won’t work until this box is checked.
Step 5: Generate variations. Open the Variations tab, select Create variations from all attributes, then click Go. WooCommerce generates every possible combination automatically.
Step 6: Add details to each variation. Open each generated variation and add a price and image. A variation needs both before it will display on the front end. Upload every image variant to the product gallery as well.
Step 7: Publish and preview. Publish the product and check the front end to confirm the variations display and behave as expected.
What Are Attribute Swatches, and Why Do You Need a Plugin?
Attribute swatches replace WooCommerce’s plain-text dropdown with a visual selector: color swatches show a small color box for each option, and image swatches show a thumbnail, like a fabric pattern or product photo. Standard WooCommerce only offers text-based dropdowns, and it doesn’t let you restyle the attribute section on the product page. A dedicated attribute plugin is what adds swatches, controls where they display, and lets you customize their appearance.
The 10 Best WooCommerce Attribute Plugins
1. YITH Color, Image & Label Variation Swatches for WooCommerce
This plugin has been renamed from “YITH WooCommerce Color and Label Variations” and remains one of the most actively maintained options in this list, with recent updates for current WooCommerce and WordPress versions. It replaces the default dropdown with color, image, or label swatches, supports a hover preview that changes the product image before the customer clicks, and lets you set a separate image gallery per variation.
Key Features:
- Color, image, and label swatch types, including bicolor swatches
- Hover-to-preview: the product image updates when a customer hovers over a swatch
- Per-variation image galleries
- Option to show swatches on the Shop and category pages, not just the product page
- A newer feature lets customers change variation attributes directly from the cart page without returning to the product
Price: A free version is bundled with the plugin on WordPress.org. Premium pricing is subscription-based; check the official YITH pricing page for current plans before purchasing.
2. XT Variation Swatches for WooCommerce (formerly Woo Variation Swatches)
Originally sold as “Woo Variation Swatches” by XplodedThemes, this plugin now goes by “XT Variation Swatches for WooCommerce” and is still actively updated. It turns dropdown attributes into color, image, or label swatches and automatically applies image swatches to color attributes that already have an image assigned.
Key Features:
- Color, image, and label swatch types, with mixed types allowed on the same product
- Works on the product page, shop/category pages, and quick view modals
- Adjustable swatch width, height, and alignment
- Automatic cross-mark on out-of-stock variations
- Attribute quick-edit from the product screen
Price: Pricing has changed from its original XplodedThemes listing. Check the current XplodedThemes pricing page before publishing any figures.
3. Swatchly
Swatchly adds image, color, label, or pattern swatches to the product page, with matching swatch display on shop and category pages.
Key Features:
- Squared, rounded, and circle swatch styles
- Text and image tooltip types
- Customizable font size, height, width, and alignment
- Mobile-responsive display
Price: Not independently reverified for this update. Confirm current plans on the official Swatchly site before publishing.
4. Product Variation Swatches For WooCommerce
This plugin displays attribute swatches on both the product page and the shop/category pages, with a hover option so customers can preview variants without clicking.
Key Features:
- Color, text, and image/pattern swatches
- Swatches shown in the Related Products section
- Cross-marked icon for out-of-stock variations
- Per-variation product gallery with import/export support
Price: Not independently reverified for this update. Confirm current plans on the official site before publishing.
5. Smart Bulk Variations
Smart Bulk Variations is built for a different problem than swatches: it displays each variation as its own item in a list, grid, table, or attribute view, and lets customers add multiple variations to the cart at once from a single product page.
Key Features:
- List, grid, table, and attribute view layouts
- Layouts can be applied per product or store-wide
- Table view customization by SKU, stock, and short description
Price: $49 per year, confirmed via the current WooCommerce.com marketplace listing.
6. WooCommerce Variation Master
WooCommerce Variation Master, by WPSwings, remains active and now supports WooCommerce’s High-Performance Order Storage (HPOS). Its standout feature is letting customers change a variation, like size or color, directly from the cart page via a pop-up, without returning to the product page.
Key Features:
- Full attribute-section styling control
- In-cart variation editing pop-up
- Attribute and gallery image import
- Swatches on shop, archive, and category pages
Price: Sold on CodeCanyon; current pricing should be confirmed there before publishing, since licensing tiers can change.
7. Variation Swatches for WooCommerce
This is a free, actively maintained plugin on WordPress.org that automatically converts variation dropdowns into button swatches on activation, with recent user reviews confirming ongoing support and updates.
Key Features:
- Image, color, and label swatches
- Automatic dropdown-to-button conversion on install
- Round and circle swatch shapes
- Tooltip support
- Quick view mode display
Price: Free on WordPress.org, with paid tiers for advanced features. Confirm current paid pricing on the developer’s site.
8. WooCommerce Variation Swatches (Woosuite)
This plugin converts dropdown attributes into button swatches and includes a dual-color swatch option for products with two dominant colors.
Key Features:
- Dual-color variation swatches
- Tooltip and border styling
- Swatches on shop and category pages
- Multiple display options for out-of-stock variations
- Vertical per-variation image slider
Price: Not independently reverified for this update. Confirm current plans on the official site before publishing.
9. WooCommerce Attribute Swatches
This plugin focuses on color and image swatches, with a built-in color picker for setting attribute values instead of typing plain text.
Key Features:
- Image and color swatches
- Global or per-product swatch assignment
- Swatches on shop/category pages
- WPML compatibility
Price: Not independently reverified for this update. Confirm current plans on the official site before publishing.
10. Variation Swatches and Photos
A simpler plugin supporting image and color swatches, with round and square shape options and a choice between a color picker or manual color codes.
Key Features:
- Image and color swatches
- Round and square swatch shapes
- Manual color code entry
Price: Not independently reverified for this update. Confirm current plans on the official site before publishing.
Frequently Asked Questions
How do I add a variable product in WooCommerce?
Go to the Product Data box on your product page, select Variable product from the dropdown, then create your attributes and check them off as Used for variations. Generate variations from the Variations tab, then add a price and image to each one.
What are attribute swatches in WooCommerce?
Attribute swatches are visual replacements for WooCommerce’s default text dropdown. Color swatches show a small color box, and image swatches show a thumbnail image, so customers can see their options at a glance instead of reading a list.
Can I display product variations on the shop page instead of just the product page?
Yes, but only with a plugin. Most attribute plugins in this list, including YITH and XT Variation Swatches, include an option to show swatches on the shop or category page as well as the single product page.
Is there a free plugin for WooCommerce attribute swatches?
Yes. Several plugins on this list, including YITH and Variation Swatches for WooCommerce, offer a free version on WordPress.org with basic swatch functionality, and paid upgrades for shop-page display, tooltips, and per-variation galleries.
Key Takeaways
- A variable product lets customers choose between options like color and size before adding an item to the cart, while a Simple product has none.
- Default WooCommerce only shows attributes as plain-text dropdowns; a plugin is required for color, image, or label swatches.
- Global attributes can be reused across every product in your store, while local attributes only apply to the single product where they were created.
- YITH and XT Variation Swatches (formerly Woo Variation Swatches) are the most actively maintained options in this list as of mid-2026.
- Confirm current pricing directly on each plugin’s official site before making a purchase decision, since several plans have changed since this article was last reviewed.
Free version on WordPress.org. Every Pro licence includes a 30-day money-back guarantee.
