How to Change quantity selector and variant selector Color?

[WolTeek]

I cannot change it in theme settings and that’s how it looks now.
Link to the website: https://jinglebellsboutique.com/

[StephensWorld]

Your theme is probably using the same colour for “links” as it does the variant options.

Go into your theme colours, and look at what you have set to ‘black’ (#000000) … and then edit the options until you figure out which one is controlling the color for the variant options.

Otherwise you can try adding the following coding to your theme’s CSS file, or to the specific block/section’s “custom CSS” section (within the theme editor) to make the text for those white:

.block-swatch {
    color: #ffffff;
}
.quantity-selector__button {
    color: #ffffff;
}
.quantity-selector__input {
    color: #ffffff;
}

Hope the above helps!

Cheers,

Stephen

[WolTeek]

Hi,
Thanks for response. I tried it but It changes colors only for a text. You probably have visited my website. I want it to look this way. (like the ghost in the bottom of the home page)

[StephensWorld]

Try using this coding instead then:

.block-swatch {
    background-color: transparent;
    color: #800000;
    border-color: #800000;
}

.quantity-selector__button {
    background-color: transparent;
    color: #800000;
    border-color: #800000;
}
.quantity-selector__input {
    background-color: transparent;
    color: #800000;
    border-color: #800000;
}

.quantity-selector {
    background-color: transparent;
    color: #800000;
    border-color: #800000;
}

[WolTeek]

Thanks for help!
It worked but the only thing is the frame color is different (when option selected)

[StephensWorld]

This one has me stumped. I’m not sure how the theme is dictating which colour is being used for the selected variant.

Sorry I couldn’t solve that one for you. Hopefully, I’ve gotten you close enough that it’s okay. Otherwise, maybe someone else can chime in with the final ‘piece of the puzzle’ here!