Dawn theme collection page color swatch customization

I’m using the latest version of the Dawn theme. I added custom code for a color swatch on the collection page product card with the help of support. It works well on desktop, but the swatches in mobile appear in two lines, which doesn’t look nice. I want to convert the color swatches into a carousel with small arrows on hover. Additionally, when clicking on a color, the image quality becomes low. How can I improve the image clarity?

Website : https://mannavan.myshopify.com/

password: offnorth

Thanks in advance

Hello @Sivadarshan

Remove the background image (GIF) and set the swatch to use only a background color