How can I alter the background color of variant badges in Dawn?

Store Design
, , , , ,
1

Hi,

I want to edit the background color of the 2 variant badges on my product page. if possible i would like a gradient color for the first badge.

Thanx for your help

Alex

2

Hi @Alex087

I hope you are doing good and welcome to the Shopify Community!
I am San from MS Web Designer.

Please add this css in your bottom of the base.css file:

.product-form__input input[type=radio]:checked+label {background: #7069bc54!important; color: #000 !important;}

Regards,

San

3

hi San,

Thanx for your help,

Is it possible to have a different color for each variant?

4

Hi @,

You can try this code by following these steps:

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file base.css

Step 3: Paste the below code at the bottom of the file → Save

.card__badge .badge{
background:black
}

PageFlyOliver_0-1694687657699.png
PageFlyOliver_0-1694687657699.png772×756 178 KB

Hope my solution works perfectly for you!

Best regards,

Oliver | PageFly

5

Not possible.