Change dropdown options color

Store Design
,

Topic summary

A user is experiencing a visibility issue where dropdown menu options appear white on a white background, making them unreadable.

Two solutions were provided:

  1. Via theme.liquid file:

    • Navigate to Online Store → Edit Code
    • Locate the theme.liquid file
    • Insert custom CSS code above the closing </body> tag

  2. Via CSS file:

    • Go to Online Store → Themes
    • Open the Asset folder
    • Find main.css (or base.css/style.css/theme.css)
    • Add CSS targeting the select options at the bottom of the file
    • The suggested code changes the text color to black with !important flag

Both responses included code snippets (though partially garbled in the input) and screenshots demonstrating the expected result. The issue appears solvable through basic CSS customization to override the default dropdown option styling.

Summarized with AI on November 5. AI used: claude-sonnet-4-5-20250929.
1

Hi, my dropdown options are white on white background, can anyone help ?

https://c50810-c5.myshopify.com/pages/contact/

1 Like
2

Hey @Daniel19901

Follow these Steps:

  1. Go to Online Store

  2. Edit Code

  3. Find theme.liquid file

  4. Add the following code in the bottom of the file above tag

RESULT:

Moeed_0-1726252163547.png
Moeed_0-1726252163547.png639×166 8.09 KB

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

3

Hi @Daniel19901

Check thiso ne.

From you Admin page, go to Online Store > Themes

Select the theme you want to edit

Under the Asset folder, open the main.css(base.css, style.css or theme.css)

Then place the code below at the very bottom of the file.

select#\35 5339-select-1 option {
    color: black !important;
}

And Save.

Result:

Made4uoRibe_0-1726254615885.png
Made4uoRibe_0-1726254615885.png715×398 13.7 KB

Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!