hover thicker border (outline) for cart+customer account icons

Store Design
, , , ,

Topic summary

A user seeks CSS code to add a thicker border/outline when hovering over cart and customer account icons in their store header.

Resolution:

  • Another community member directed them to a solution already provided in a different post
  • The original poster later requested extending the effect to the search icon as well
  • Issue resolved: They figured out the solution independently using CSS:
.header__icon .icon:hover {
  stroke: black;
}

This CSS targets header icons and applies a black stroke on hover, creating the desired outline effect for cart, account, and search icons.

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

I would like to have a ticker outline when I hover the cart + customer account icons? Please let me know if you have a solution.

www.inprintstore.com

pass: shiznitz

1 Like
2

Hi @lplabranche

I already reply on your other post.

Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!

3

Thanks! Would you be able to make it affect the search icon as well by any chance?

EDITED* nevermind, figured it out myself, If anyone else wanted to know:

.header__icon .icon:hover {
stroke: black;
}

1 Like