@AhmadHamido
Posted
Hello Soytto, first I want to tell you that your layout looks really nice, and as for the hover effect on the icons, you can do something like this: .icon a:hover, .icon a:active { filter: invert(59%) sepia(68%) saturate(463%) hue-rotate(122deg) brightness(91%) contrast(86%); }
This should do the work, I did it like this. Worst case scenario, put "img" instead of "a". Hope this helps, and happy coding!
Marked as helpful
@Soytto
Posted
@AhmadHamido thank you for your feedback !
wow uhhh... seems a little difficult, how did you figured out to find that ?:O
@AhmadHamido
Posted
@Soytto I just had to do some google research, I found something that is similar to what I am looking for, so I said let's try it, and it turned out working really fine. If you want to make sure about that, you can check my solution on my profile, and also you can check my code on my GitHub profile
@Soytto
Posted
@AhmadHamido I did some research as well to find a slightly simpler way and this is what I found: if you directly use the <svg> instead of <img> in HTML, then you can do in css : svg:hover path { fill: hsl(171, 66%, 44%); } and instead of using "alt" you can use "title" :)
@AhmadHamido
Posted
@Soytto thank you for your info Soytto :D I probably used the longer way haha