How do I change the color of the review stars from black to yellow at the product collection page of my Horizon theme?

Ask & Offer

Topic summary

A user seeks to change review star colors from black to yellow on their Horizon theme’s product collection page.

Initial Solution Provided:

  • Add CSS code to Theme Settings > Custom CSS:
.stars.filled-star {
    fill: #ffaa00;
}

Current Status:

  • The CSS solution successfully changed most stars to yellow
  • However, half-stars remain black and need additional fixing
  • The helper has requested the website URL to investigate the half-star issue further

Remaining Issue:
The discussion is ongoing, awaiting a complete solution for the half-star color problem. Screenshots were provided showing both the original issue and the partial fix.

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

How do I change the color of review stars from black to yellow at the default collection page? I tried searching codes but I could not locate it.

I have attached screenshot too.

aaa
aaa1907×1057 166 KB

1 Like
2

Hi @sebkwon

Please share your store URL and password protected if have.

3

Hey @sebkwon

Welcome to Shopify Community! Can you share your Store URL so I can have a look on it? Also, if you have password enabled then please share the password as well. Your cooperation would be greatly appreciated.

Best Regards,
Moeed

4

Hi @sebkwon,

Please go to Customize > Theme settings > Custom CSS and add code:

.stars.filled-star {
    fill: #ffaa00;
}
1 Like
5

Thank you for the solution, is has worked! But one more thing is that certain half stars is still in black color. How can I rectify this issue?

Attached is the screenshot

aaa
aaa1211×612 337 KB

6

Hi @sebkwon,

Please send the website link, I will check it for you