How do I change the background colour of the variant picker?

How do I change the background colour of the variant picker?

PM98
Excursionist
46 0 7

I want to change the background colour of a variant picker so the background is a different colour

 

Screenshot 2024-05-19 at 12.54.15.png

Replies 2 (2)

PageFly-Amelia
Shopify Partner
626 165 238

Hello @PM98 

This is Amelia at PageFly - Shopify Advanced Page Builder app.

 

You can try the following steps I have provided to help you solve the problem you are facing:

Step 1: Online Stores > Themes > Edit code

Step 2: Choose file base.css

Step 3: Add code

variant-selects {
  background-color: red !important;
}

 

Hoping my solution helps you solve your problem.

Best regards,

Amelia | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


➜ Optimize your Shopify store with PageFly Page Builder (Free plan available) 
➜ Weekly updated Shopify tutorials on YouTube 


All features are available from Free plan. Live Chat Support is available 24/7.

devcoders
Shopify Partner
992 127 251

Hi @PM98 

Go to Online Store, then Theme, and click on Edit code.
Locate the file assets/base.css, and paste the code provided below at the end of the file.

 

.select__select {
background-color: #e0e0e0; /* Change 'your-desired-color' to the color you want */
}
.product-form__input.product-form__input--dropdown ::after {
box-shadow: none!important;.field:
after, .select:after, .customer .field:after, .customer select:after, .localization-form__select:after;
}
.product-form__input.product-form__input--dropdown:focus {
outline: none;
}
.field__input:focus, .select__select:focus, .customer .field input:focus, .customer select:focus, .localization-form__select:focus.localization-form__select:after{
box-shadow: none!important;.field:
}

devcoders_0-1716122916359.png

devcoders_1-1716122931815.png

 

Shopify Developer: Helping eCommerce Stores

If you need assistance with your store, feel free to contact us at devcodersp@gmail.com
WhatsApp No: +91 8516919310 If my assistance was helpful, please consider liking and accepting the solution. Thank you!