Advanced Color Swatches

Advanced Color Swatches



Magento Platform
Open Source (CE), 1.7, 1.8, 1.8.1, 1.9, 1.9.1, 1.9.2, 1.9.3

Tech Specifications

Current Version:
Stable Build
29 November, 2017
Extensions, Content & Customizations
License Type:
Open Software License 3.0 (OSL-3.0)


Color swatches and attributes selector for the layered navigation block, products list and details page

Other Extensions by Mango Extensions


Back to top

Our color swatch extension displays color swatches or attribute selectors on the product list and the product details page. Use advanced swatches with zoom for a better customer experience. If your customers need to see your product in specific colors, they can use our extensions to display color swatches on the products lists or the product page. They can be used to display options selectors for other attributes as well: texture, pattern, size.

Color swatches for Magento can be images or hexadecimal colors, use the admin interface to upload swatches for products.

A list of available features: 

Products list

  • Display color swatches in the catalog product listing, to have a preview of the product options.
  • This extension can be used to display swatches for color, brand, type, size or any other configurable attribute, each product on the list will display one swatches block.
  • Multiple attributes can be selected to appear as swatches, useful for catalogs with multiple attributes sets that require different color attributes ( e.g. shoe color, clothing color, hats color ).
  • Configurable options: attribute to display as swatches, and option to display swatches or small images of the child products
  • The swatches can also be displayed in the layered navigation, the admin can choose the attributes to display as swatches in the layered navigation
  • Preselect images in the catalog when the layered navigation filters are applied, e.g.: shows only red models when the filter is set to color: red.
  • Option to display a second row of available options as text, this can be used to display available sizes of a configurable product.
  • The swatches can be images or hexadecimal colors
  • Availability list: show attribute as list, without swatches, and update values based on selected swatches, e.g.: display list of available sizes for each color of a given product.


Product details page

  • This extension can be used to display swatches for color, brand, type, size or any other configurable attribute
  • Show/hide gallery images based on swatches
  • The swatches can be images or hexadecimal colors
  • Options can be displayed as labels, swatches or select boxes
  • The images per color/attribute can be set in the configurable product admin page, without need of setting the images for each child product (only one gallery is needed)
  • Lightbox jQuery plugin to enlarge the images
  • jQuery plugins for images zoom: ElevateZoom or CloudZoom.
  • Bxslider jquery plugin for products gallery images carousel
  • Product Gallery Carousel options: right, left or below main image
  • Configurable value: which options will change the product image in the details page
  • Override cart image based in gallery, so only the parent configurable product gallery is necessary.
  • Reload attributes based on child product selection.


Compatible with Porto and Ultimo theme. Contact us for more information.



Please visit the demo site for this extension:



Release Notes

Back to top


  • Compatible with Open Source (CE) : 1.7 1.8 1.8.1 1.9 1.9.1 1.9.2 1.9.3
  • Stability: Stable Build
  • Description:

    # Fixed background mode for swatches on product details page and layered navigation
    # Elevate Zoom integration
    # Fixed etalage image placeholder when gallery contains no images.
    # Simple product price: fixed price switching when price shows tax.


Back to top
The best place to start if you need help with a specific extension is to contact the developer. All Magento developers have both a contact email and a support email listed.

Q & A

Back to top


Back to top