
Replace dropdown fields on your variable products with WooCommerce Color and Image Swatches
Using color and image swatches provides a much nicer way to display variations of a product, available styles, available sizes, or pretty much anything else you can display using an image or color.
Shoppers appreciate visual representations of product attributes when using your store, and it can help present a polished and clean look. WooCommerce Color and Image swatches is the answer if you are looking to edge out the competition.
The admin interface allows you define colors and images at attribute level or product level:

Custom swatches for a product
To see live examples and plugin in action, go to demos.
* Version: 3.1.8
* Requires at least: 3.5
* Tested up to: 6.4
* WC requires at least: 7.0
* WC tested up to: 8.4
*** WooCommerce Variation Swatches and Photos ***
2023.04.28 - version 3.1.8
* Update: Add aria roles and labels to the swatches to provide help for assistive technologies.
* Update: CSS updates to modernize the UI a bit.
* Update: Update wc_core_dropdown_variation_attribute_options to match latest wc_dropdown_variation_attribute_options function.
* Update: Double check that the swatch options exist before attempting to render them. Fixes issues with some themes that do not properly load the swatch options.
* Update: PHP 8.2+ compatibility.
* Update: WC and WP compatibility.
info: https://woocommerce.com/products/variation-swatches-and-photos/