How can I change the color of bold text and buttons on my website?

Shopify Discussion

Topic summary

Problem: After rebranding and updating theme color settings, bold text and buttons continued displaying yellow. Theme settings showed no yellow and custom CSS overrides didn’t change the appearance.

Cause identified: Hardcoded color values were found in theme CSS files (e.g., base.css) using the yellow hex code #ffad02, which overrode theme settings. Screenshots highlighted these references.

Actions/Outcome: The site maintainer located the hardcoded entries, including the button color rules, and confirmed the fix after updating them. No further issues were raised.

Implications: Theme color settings won’t affect elements when explicit CSS values are set in files. Searching project CSS (especially base.css and similar) for #ffad02 and replacing/removing those values is necessary so brand colors take effect.

Notes: CSS (Cascading Style Sheets) controls visual styles and can override theme settings when values are hardcoded. Images/screenshots supported identifying the exact file and lines.

Status: Resolved; no open questions remain.

Summarized with AI on December 31. AI used: gpt-5.
1

I’m having trouble changing the color of bolded text and buttons on my website.

For clarification: I did not build the site originally, but have been working on it for a few years now. We are rebranding I updated the brand colors for the theme, however, this did not change the color of the bolded text and buttons.

For example: in theme settings, all the colors are changed and there is nothing yellow. However, while everything else updated to the new brand colors, the buttons and bold text are still displaying yellow. I have checked and there is no css listed for the components. When I try to add css to make the text be one of the brand colors, nothing changes.

I tried to look through the code, but couldn’t see anything that could be causing this, but if anyone has an idea of exactly where I should be looking, I would greatly appreciate the help!

Screen Shot 2024-04-17 at 4.02.56 PM.png
Screen Shot 2024-04-17 at 4.02.56 PM.png616×1402 75.6 KB

Screen Shot 2024-04-17 at 3.55.59 PM.png
Screen Shot 2024-04-17 at 3.55.59 PM.png2836×1512 618 KB

Screen Shot 2024-04-17 at 3.56.48 PM.png
Screen Shot 2024-04-17 at 3.56.48 PM.png2840×1430 665 KB

2

Hi Megan, you can definitely see references of the yellow color (#ffad02) in your css files. Here’s a screenshot of the base.css file:

MichalKopec_0-1713402268845.png
MichalKopec_0-1713402268845.png2019×1739 538 KB

3

I have no idea why that wasn’t coming up when I searched it! Found the code for the button color as well! THANK YOU SO MUCH!

1 Like
4

You’re welcome!