When changing to from desktop to mobile, the font changes color

Store Design
,

Topic summary

A user reports a font color inconsistency between desktop and mobile views: text displays correctly in black on desktop but switches to white on mobile, creating a visibility issue.

Troubleshooting Attempts:

  • Another user provided CSS code to be added to the theme’s base.css file, targeting button colors with #000 background and #fff color properties
  • The original poster tested the code but reported it only changed button colors, not the problematic font color
  • A second CSS snippet was provided focusing specifically on .banner__buttons elements
  • This solution also failed to resolve the issue

Current Status:
The problem remains unresolved. The provided CSS fixes targeted button styling rather than the general font color causing the mobile display issue. Screenshots were shared to illustrate the color difference between desktop and mobile versions.

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

On the desktop version my color is black, as it should be, but whenever i go into mobile version it changes to white?
Black Colour:
https://gyazo.com/3dded028a50fbb3a4b15858f2c0cc623
White colour:
https://gyazo.com/c11afc5b05f280e7b5a4c82e426b875b

Website is:
https://avanclothingstore.myshopify.com/
password:
sheiti

1 Like
2

@Rasmushovggard

yes, please try this code same color both desktop and mobile

  1. Go to Online Store->Theme->Edit code
  2. Asset->/base.css ->paste below code at the bottom of the file.
.banner__buttons a.button.button--primary {
    background: #000 !important;
    color: #fff !important;
}
3

Thanks for the answer, but unfortunately it didn’t work

It changed the buttons color, and not the fonts color.

1 Like
4

@Rasmushovggard

can you try this code

.banner__buttons a.button.button--primary {
    background: #000 !important;
}
5

This didn’t work either :disappointed_face: