The swatches described above are interactive ones. Interactive swatches allow comparing different colors directly from the product list without visiting the product page.
Non-interactive swatches require customers to visit the product page, thus reducing the UX benefits of the swatches. So, consider adding interactive swatches for the best user experience
, especially if you sell visually-driven products, such as clothes, shoes, beauty products, furniture, or decor.