Heart SVG Icons
Hearts handle likes, favorites, and wishlists. This page pairs outline and filled versions of the same silhouette so the toggle animation between them stays perfectly aligned.
Showing top 150 (of many)·113 icon packs·Free & open source
Showing top 150 results, many more icons available
Search all Heart Icons iconsRelated icons
Heart Icons by library
The icons above come from 113 open-source libraries. Open one to see its full set in a matching style.
- Tabler Icons16
- Material Design Icons13
- Material Symbols5
- Phosphor4
- Myna UI Icons2
- Lucide2
- Solar2
- IconPark Outline1
- TDesign Icons1
- Bootstrap Icons1
- IconaMoon1
- HeroIcons1
101 more libraries
- BoxIcons v21
- Akar Icons1
- Feather Icons1
- Charm Icons1
- Arcticons1
- Keyline Icons1
- Reicon1
- Huge Icons1
- Boxicons1
- Glyphs1
- Streamline1
- Pinhead Map Icons1
- IconPark1
- WebHostingHub Glyphs1
- Health Icons1
- Griddy Icons1
- Font Awesome Solid1
- Streamline color1
- Web3 Icons1
- Fluent UI MDL21
- Iconoir1
- Line Awesome1
- Flex free icons1
- Siemens Industrial Experience Icons1
- Font Awesome 6 Solid1
- IonIcons1
- Famicons1
- Pepicons Pencil1
- Pepicons Pop!1
- Pepicons Print1
- Framework7 Icons1
- Material Line Icons1
- Unicons1
- Mage Icons1
- Pixelarticons1
- Font Awesome 5 Solid1
- Flex color icons1
- Stash Icons1
- Jam Icons1
- Glyphs Poly1
- Pico-icon1
- Gravity UI Icons1
- SmartIcons Glyph1
- Majesticons1
- css.gg1
- Font Awesome 41
- BoxIcons v2 Solid1
- Codicons1
- Memory Icons1
- @icons1
- NRK Core Icons1
- Vaadin Icons1
- Fontisto1
- Lineicons1
- Pixel Icon1
- Temaki1
- CoreUI Free1
- ProIcons1
- Vadivam1
- IcoMoon Free1
- OpenSearch UI1
- System UIcons1
- Pepicons1
- OOUI1
- Gitlab SVGs1
- Meteor Icons1
- Guidance1
- Ligature Symbols1
- Dashicons1
- Typicons1
- Radix Icons1
- Entypo+1
- Prime Icons1
- Elusive Icons1
- Zondicons1
- Circum Icons1
- Humbleicons1
- Material Design Light1
- Foundation1
- Font Awesome Regular1
- Feather Icon1
- HeroIcons v1 Outline1
- HeroIcons v1 Solid1
- Open Iconic1
- Maki1
- Rivet Icons1
- Gridicons1
- Simple line icons1
- Mono Icons1
- Mono Icons1
- Matita1
- Font Awesome 6 Regular1
- Font Awesome 5 Regular1
- FormKit Icons1
- Nimbus1
- Bytesize Icons1
- Elegant1
- Web Symbols Liga1
- Icalicons1
- CodeX Icons1
- Evil Icons1
Frequently Asked Questions
Heart or star for a favorites feature?
Hearts read as emotional appreciation and fit social content; stars read as utility bookmarking and fit documents or repos. Pick one metaphor and never use both for the same action.
How do I animate the like toggle?
Scale the filled heart from 0.8 to 1 with a spring curve on tap, about 300ms. Swap outline for fill at the animation start, not the end, so the state change feels instant while the bounce plays.