How to change colour of text in variant picker

[Maxyb77]

The global text colour on my store is White which is what’s causing it to blend in. Is there anyway I can tweak the code to ensure variant picker text is always black? Someone please help thanks.

[GemPages]

Hello @Maxyb77

Can you give me your page URL( with pass if your store password is enabled) so I can check it for you?

Kind & Best regards,
GemPages Support Team

[Maxyb77]

Of course,

truegarmz.com

[Maxyb77]

I just enabled the theme for you

[GemPages]

Hi @Maxyb77

You can follow the below steps to add black color for variant picker text:

1. Go to Online Store → Theme → Edit code.

2. Open your base.css in the Assets folder.

3. Paste the below code at the end of the file. https://prnt.sc/q6_4nifHg04t

variant-selects select.select__select,
.product-form__quantity .quantity__input{
 color: #000 !important; 
}
variant-selects svg path,
.product-form__quantity .quantity__button svg path{
  fill: #000 !important; 
}

4. Save the file and double-check.

Best regards,
GemPages Support Team

[Maxyb77]

Hey @GemPages

Just wondering what is an efficient way to search for the https code, I tried to use control + F but it didn’t work.

[Maxyb77]

Hey probably being annoying. So I used control + f to check for the https and it did not show up.

[GemPages]

@Maxyb77

If following the steps above seems difficult for you.

Please allow me to guide you in more detail:

1. Go to Online Store → Theme → Edit code. You can find it as image:

2. Search bass.css here:

3. Add the code at the end of the file. https://prnt.sc/unVJZk822N-G

If this is another question, could you please give me more information and pictures if possible?

Best regards,
GemPages Support Team

[Maxyb77]

Thank you so much. It’s late at night and my brain was not functioning properly. I was making up random steps but it is all sorted now. Thank you so much once again!

[GemPages]

I am glad that my solution is helpful to you

[Maxyb77]

Hey @GemPages ,

Not sure if you are still available for help however whenever I try to customize my theme and save changes, this is what is displayed.

Would you happen to know how to fix this?

[GemPages]

Hi @Maxyb77

As in the above image, Dynamic source error(s) appears on the page.

You can refer a Shopify’s article about it https://help.shopify.com/en/manual/online-store/themes/theme-structure/sections-and-blocks#using-metafields-and-dynamic-sources

You can double-check the dynamic sources added to the page and make sure everything is set up properly.

Best regards,
GemPages Support Team

[Maxyb77]

Hey @GemPages been a few days.

I have exactly the same issue I had as the one at the start of this post.

The customer is unable to read everything in the cart section due to the colour of the text.

Please guide me on what to do again, appreciate you

[maxikaya]

I am trying to make the same change. The code you gave changed the color of the Quantity Selector pill only, not the Variant pills. I am trying to change the text in the “Color” variant to navy / white.

I appreciate any help.