heart straight break icon
heart-straight-break-light from Phosphor by Phosphor Icons · Light · MIT Free for personal and commercial use.
- Name
- heart-straight-break-light
- Set
- Phosphor
- Style
- Light
- Viewbox
- 256×256
- License
- MIT
5 other variants in Phosphor
Related icons in Phosphor
Use the heart straight break icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M221.62 58.38a56.06 56.06 0 0 0-79.16 0L128 72.24l-14.44-13.9a56 56 0 0 0-79.2 79.21l89.37 90.66a6 6 0 0 0 8.55 0l89.33-90.63a56.06 56.06 0 0 0 .01-79.2m-8.51 70.75L128 215.45L42.89 129.1a44 44 0 0 1 62.23-62.24l.08.08l14.16 13.64l-11.51 11.08a6 6 0 0 0-.08 8.56L135.53 128l-11.76 11.76a6 6 0 1 0 8.49 8.48l16-16a6 6 0 0 0 0-8.49l-27.68-27.69l30.24-29.12a.3.3 0 0 0 .08-.08a44 44 0 1 1 62.21 62.27"/></svg>
React
import type { SVGProps } from "react";
export function PhHeartStraightBreakLight(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M221.62 58.38a56.06 56.06 0 0 0-79.16 0L128 72.24l-14.44-13.9a56 56 0 0 0-79.2 79.21l89.37 90.66a6 6 0 0 0 8.55 0l89.33-90.63a56.06 56.06 0 0 0 .01-79.2m-8.51 70.75L128 215.45L42.89 129.1a44 44 0 0 1 62.23-62.24l.08.08l14.16 13.64l-11.51 11.08a6 6 0 0 0-.08 8.56L135.53 128l-11.76 11.76a6 6 0 1 0 8.49 8.48l16-16a6 6 0 0 0 0-8.49l-27.68-27.69l30.24-29.12a.3.3 0 0 0 .08-.08a44 44 0 1 1 62.21 62.27"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M221.62 58.38a56.06 56.06 0 0 0-79.16 0L128 72.24l-14.44-13.9a56 56 0 0 0-79.2 79.21l89.37 90.66a6 6 0 0 0 8.55 0l89.33-90.63a56.06 56.06 0 0 0 .01-79.2m-8.51 70.75L128 215.45L42.89 129.1a44 44 0 0 1 62.23-62.24l.08.08l14.16 13.64l-11.51 11.08a6 6 0 0 0-.08 8.56L135.53 128l-11.76 11.76a6 6 0 1 0 8.49 8.48l16-16a6 6 0 0 0 0-8.49l-27.68-27.69l30.24-29.12a.3.3 0 0 0 .08-.08a44 44 0 1 1 62.21 62.27"/></svg> </template>
CSS
.icon-heart-straight-break-light {
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%20256%20256%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M221.62%2058.38a56.06%2056.06%200%200%200-79.16%200L128%2072.24l-14.44-13.9a56%2056%200%200%200-79.2%2079.21l89.37%2090.66a6%206%200%200%200%208.55%200l89.33-90.63a56.06%2056.06%200%200%200%20.01-79.2m-8.51%2070.75L128%20215.45L42.89%20129.1a44%2044%200%200%201%2062.23-62.24l.08.08l14.16%2013.64l-11.51%2011.08a6%206%200%200%200-.08%208.56L135.53%20128l-11.76%2011.76a6%206%200%201%200%208.49%208.48l16-16a6%206%200%200%200%200-8.49l-27.68-27.69l30.24-29.12a.3.3%200%200%200%20.08-.08a44%2044%200%201%201%2062.21%2062.27%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%20256%20256%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M221.62%2058.38a56.06%2056.06%200%200%200-79.16%200L128%2072.24l-14.44-13.9a56%2056%200%200%200-79.2%2079.21l89.37%2090.66a6%206%200%200%200%208.55%200l89.33-90.63a56.06%2056.06%200%200%200%20.01-79.2m-8.51%2070.75L128%20215.45L42.89%20129.1a44%2044%200%200%201%2062.23-62.24l.08.08l14.16%2013.64l-11.51%2011.08a6%206%200%200%200-.08%208.56L135.53%20128l-11.76%2011.76a6%206%200%201%200%208.49%208.48l16-16a6%206%200%200%200%200-8.49l-27.68-27.69l30.24-29.12a.3.3%200%200%200%20.08-.08a44%2044%200%201%201%2062.21%2062.27%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ph/heart-straight-break-light.svg?color=%231a73e8&size=48
