Issues with button hover colour

Topic summary

A user encountered a CSS issue where button hover colors matched the button text color, making text unreadable on hover.

Solution Provided:

  • Navigate to Shopify Admin → Online Store → Themes → Actions → Edit Code
  • Locate the theme.css file in Assets
  • Add custom CSS targeting the specific button class to set hover text color to white (#fff)

Outcome:
The solution successfully resolved the issue. The helper requested the user mark the response as accepted if helpful for future reference.

Status: Resolved

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

Hello! I’m having an issue with hover colours of buttons being the same colour as the button text. I’ve tried a couple of code combos but can’t seem to crack it.

Site preview: https://1fv22be56y02cpxt-28778004573.shopifypreview.com

1 Like

Hello @kirsten11123

  1. In your Shopify Admin go to online store > themes > actions > edit code
  2. Find Asset > theme.css and paste this at the bottom of the file:
#shopify-section-template--17158298108094__collection-list .button:hover {
color: #fff;
}

1 Like

Thank you!

1 Like

Hello @kirsten11123

Thank you for your response. It’s good to know that it’s worked for you. Kindly feel free to get back to me if you need any further assistance.
If helpful then please Like and Accept Solution.