ios heart dislike icon
ios-heart-dislike from IonIcons by Ben Sperry · Regular · MIT Free for personal and commercial use.
- Name
- ios-heart-dislike
- Set
- IonIcons
- Style
- Regular
- Viewbox
- 512×512
- License
- MIT
Related icons in IonIcons
ios-addios-add-circleios-airplaneios-alarmios-albumsios-alertios-american-footballios-americanfootballios-analyticsios-apertureios-appsios-appstoreios-archiveios-arrow-backios-arrow-downios-arrow-dropdownios-arrow-dropdown-circleios-arrow-dropleftios-arrow-dropleft-circleios-arrow-droprightios-arrow-dropright-circleios-arrow-dropupios-arrow-dropup-circleios-arrow-forward
Use the ios heart dislike icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path d="M423.8 426.8L56.3 65.1c-5.6-5.5-14.6-5.5-20.1.1-5.5 5.5-5.5 14.5 0 20l367.5 361.7c3.7 3.7 9 4.9 13.7 3.6 2.4-.6 4.6-1.9 6.4-3.7 5.6-5.5 5.6-14.5 0-20z" fill="currentColor"/><path d="M64 169c0 37 15.2 89.5 46.8 132.7C171 384 272 456 272 456s29.3-20.3 65.7-51.6L68 139c-2.6 9.6-4 19.6-4 30z" fill="currentColor"/><path d="M434.2 301.7C465.8 258.5 480 206 480 169c0-62.1-50.1-112.4-112-113h-1c-39.7 0-74.8 21-95 52-20.2-31-55.3-52-95-52h-1c-29.2.3-55.8 11.6-75.7 30l281.9 277.4c19.3-19.1 36.2-40 52-61.7z" fill="currentColor"/></svg>
React
import type { SVGProps } from "react";
export function IonIosHeartDislike(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path d="M423.8 426.8L56.3 65.1c-5.6-5.5-14.6-5.5-20.1.1-5.5 5.5-5.5 14.5 0 20l367.5 361.7c3.7 3.7 9 4.9 13.7 3.6 2.4-.6 4.6-1.9 6.4-3.7 5.6-5.5 5.6-14.5 0-20z" fill="currentColor"/><path d="M64 169c0 37 15.2 89.5 46.8 132.7C171 384 272 456 272 456s29.3-20.3 65.7-51.6L68 139c-2.6 9.6-4 19.6-4 30z" fill="currentColor"/><path d="M434.2 301.7C465.8 258.5 480 206 480 169c0-62.1-50.1-112.4-112-113h-1c-39.7 0-74.8 21-95 52-20.2-31-55.3-52-95-52h-1c-29.2.3-55.8 11.6-75.7 30l281.9 277.4c19.3-19.1 36.2-40 52-61.7z" fill="currentColor"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path d="M423.8 426.8L56.3 65.1c-5.6-5.5-14.6-5.5-20.1.1-5.5 5.5-5.5 14.5 0 20l367.5 361.7c3.7 3.7 9 4.9 13.7 3.6 2.4-.6 4.6-1.9 6.4-3.7 5.6-5.5 5.6-14.5 0-20z" fill="currentColor"/><path d="M64 169c0 37 15.2 89.5 46.8 132.7C171 384 272 456 272 456s29.3-20.3 65.7-51.6L68 139c-2.6 9.6-4 19.6-4 30z" fill="currentColor"/><path d="M434.2 301.7C465.8 258.5 480 206 480 169c0-62.1-50.1-112.4-112-113h-1c-39.7 0-74.8 21-95 52-20.2-31-55.3-52-95-52h-1c-29.2.3-55.8 11.6-75.7 30l281.9 277.4c19.3-19.1 36.2-40 52-61.7z" fill="currentColor"/></svg> </template>
CSS
.icon-ios-heart-dislike {
width: 24px;
height: 24px;
background-color: currentColor;
-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20d%3D%22M423.8%20426.8L56.3%2065.1c-5.6-5.5-14.6-5.5-20.1.1-5.5%205.5-5.5%2014.5%200%2020l367.5%20361.7c3.7%203.7%209%204.9%2013.7%203.6%202.4-.6%204.6-1.9%206.4-3.7%205.6-5.5%205.6-14.5%200-20z%22%20fill%3D%22currentColor%22%2F%3E%3Cpath%20d%3D%22M64%20169c0%2037%2015.2%2089.5%2046.8%20132.7C171%20384%20272%20456%20272%20456s29.3-20.3%2065.7-51.6L68%20139c-2.6%209.6-4%2019.6-4%2030z%22%20fill%3D%22currentColor%22%2F%3E%3Cpath%20d%3D%22M434.2%20301.7C465.8%20258.5%20480%20206%20480%20169c0-62.1-50.1-112.4-112-113h-1c-39.7%200-74.8%2021-95%2052-20.2-31-55.3-52-95-52h-1c-29.2.3-55.8%2011.6-75.7%2030l281.9%20277.4c19.3-19.1%2036.2-40%2052-61.7z%22%20fill%3D%22currentColor%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20d%3D%22M423.8%20426.8L56.3%2065.1c-5.6-5.5-14.6-5.5-20.1.1-5.5%205.5-5.5%2014.5%200%2020l367.5%20361.7c3.7%203.7%209%204.9%2013.7%203.6%202.4-.6%204.6-1.9%206.4-3.7%205.6-5.5%205.6-14.5%200-20z%22%20fill%3D%22currentColor%22%2F%3E%3Cpath%20d%3D%22M64%20169c0%2037%2015.2%2089.5%2046.8%20132.7C171%20384%20272%20456%20272%20456s29.3-20.3%2065.7-51.6L68%20139c-2.6%209.6-4%2019.6-4%2030z%22%20fill%3D%22currentColor%22%2F%3E%3Cpath%20d%3D%22M434.2%20301.7C465.8%20258.5%20480%20206%20480%20169c0-62.1-50.1-112.4-112-113h-1c-39.7%200-74.8%2021-95%2052-20.2-31-55.3-52-95-52h-1c-29.2.3-55.8%2011.6-75.7%2030l281.9%20277.4c19.3-19.1%2036.2-40%2052-61.7z%22%20fill%3D%22currentColor%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ion/ios-heart-dislike.svg?color=%231a73e8&size=48
