Image hover effects - Collection List

Topic summary

A Shopify store owner seeks to implement a hover effect on collection list images, making them display in black and white by default and transition to color when users hover over them.

Solution Provided:

  • A working solution was shared (details not visible in the thread) that successfully achieved the desired black-and-white to color transition effect.
  • The implementation likely involves CSS, potentially combined with JavaScript depending on complexity.

Follow-up Request:

  • After implementing the hover effect, the store owner asks how to remove arrows from the collection titles.

Status: The initial image hover effect issue is resolved. The secondary question about removing title arrows remains open for response.

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

Hello,

Is there a way to make my collection list iamges black and white and colour on hover? How would I go about doing this code?

https://www.habooequestrian.com.au/

Thank you,

Ella.

thank you sooo much this worked! do you know how i also remove the arrow from the titles?

Yes, Ella, it’s definitely possible to make your collection list images black and white by default and then show color on hover. You’ll need to use a combination of CSS and potentially some JavaScript, depending on the exact approach and the complexity you want.