On hover change color of SVG using CSS filters - Hover Effect Tutorial
Code:
html
style
.icon {
display: inline-block;
width: 300px;
height: 300px;
background-size: cover;
}
.icon-bird:hover,
.icon-bird:focus{
filter: invert(27%) sepia(51%) saturate(2878%);
}
/style
div
object type="image/svg+xml" data="bird.svg" class="icon icon-bird"
Bird SVG
/object
/div
/html
Chapters
0:00 - Introduction to the video
0:45 - On hover change svg color
5:44 - End Tags and subscription to the channel
My second Channel:
WrestleTalkByAzhar - [ Ссылка ]
Follow Insta:
[ Ссылка ]
[ Ссылка ]
One Card App Link to Apply:
[ Ссылка ]
Cred App Link to Apply:
[ Ссылка ]
Next Steps :
---------------------------------------------------------------------------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------------------------------------------------------
Must Watch Playlists
► 1. Javascript - [ Ссылка ]
► 2. Puppetter - [ Ссылка ]
► 3. Cypress - [ Ссылка ]
► 4. Tech works - [ Ссылка ]
► 5. Vbscript Basics To Advanced - [ Ссылка ]
► 6. Jmeter - [ Ссылка ]
► 7. Excel - [ Ссылка ]
► 8. Appium - [ Ссылка ]
► 9. Shares - [ Ссылка ]
► 10. Javascript Interview Questions -[ Ссылка ]
► 11. C# Tutorials - [ Ссылка ]
► 12. HTML & CSS - [ Ссылка ]
► 13. Browser Console - [ Ссылка ]
► 14. JSON - [ Ссылка ]
► 15. Specflow - [ Ссылка ]
► 16. MongoDB - [ Ссылка ]
► 17. Postman - [ Ссылка ]
► 18. Python - [ Ссылка ]
---------------------------------------------------------------------------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------------------------------------------------------
#svg
#css
#html
![](https://i.ytimg.com/vi/cAWrRgbrT9E/maxresdefault.jpg)