heart broken icon

1 other variant in Material Design Icons

The same icon in other sets

Related icons in Material Design Icons

Use the heart broken icon

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M7.5 5c.2 0 .4 0 .6.1l2.4 4.1l-3.7 4.6C5.1 11.8 4 10.2 4 8.5C4 6.5 5.5 5 7.5 5m0-2C4.4 3 2 5.4 2 8.5c0 3.8 3.4 6.9 8.6 11.5l1.4 1.3l-3-7l4-5l-3.6-6C8.8 3.1 8.2 3 7.5 3m9 2c2 0 3.5 1.5 3.5 3.5c0 2.6-2.6 5.2-6.6 8.8l-.3-2.3l4.8-5.3l-2.3-4.5c.3-.2.6-.2.9-.2m0-2c-1.3 0-2.6.5-3.6 1.3l2.6 5.1l-4.5 5l1 7l1.4-1.3c5.2-4.7 8.6-7.8 8.6-11.5C22 5.4 19.6 3 16.5 3"/></svg>

import type { SVGProps } from "react";

export function MdiHeartBrokenOutline(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M7.5 5c.2 0 .4 0 .6.1l2.4 4.1l-3.7 4.6C5.1 11.8 4 10.2 4 8.5C4 6.5 5.5 5 7.5 5m0-2C4.4 3 2 5.4 2 8.5c0 3.8 3.4 6.9 8.6 11.5l1.4 1.3l-3-7l4-5l-3.6-6C8.8 3.1 8.2 3 7.5 3m9 2c2 0 3.5 1.5 3.5 3.5c0 2.6-2.6 5.2-6.6 8.8l-.3-2.3l4.8-5.3l-2.3-4.5c.3-.2.6-.2.9-.2m0-2c-1.3 0-2.6.5-3.6 1.3l2.6 5.1l-4.5 5l1 7l1.4-1.3c5.2-4.7 8.6-7.8 8.6-11.5C22 5.4 19.6 3 16.5 3"/></svg>
  );
}

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M7.5 5c.2 0 .4 0 .6.1l2.4 4.1l-3.7 4.6C5.1 11.8 4 10.2 4 8.5C4 6.5 5.5 5 7.5 5m0-2C4.4 3 2 5.4 2 8.5c0 3.8 3.4 6.9 8.6 11.5l1.4 1.3l-3-7l4-5l-3.6-6C8.8 3.1 8.2 3 7.5 3m9 2c2 0 3.5 1.5 3.5 3.5c0 2.6-2.6 5.2-6.6 8.8l-.3-2.3l4.8-5.3l-2.3-4.5c.3-.2.6-.2.9-.2m0-2c-1.3 0-2.6.5-3.6 1.3l2.6 5.1l-4.5 5l1 7l1.4-1.3c5.2-4.7 8.6-7.8 8.6-11.5C22 5.4 19.6 3 16.5 3"/></svg>
</template>

.icon-heart-broken-outline {
  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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M7.5%205c.2%200%20.4%200%20.6.1l2.4%204.1l-3.7%204.6C5.1%2011.8%204%2010.2%204%208.5C4%206.5%205.5%205%207.5%205m0-2C4.4%203%202%205.4%202%208.5c0%203.8%203.4%206.9%208.6%2011.5l1.4%201.3l-3-7l4-5l-3.6-6C8.8%203.1%208.2%203%207.5%203m9%202c2%200%203.5%201.5%203.5%203.5c0%202.6-2.6%205.2-6.6%208.8l-.3-2.3l4.8-5.3l-2.3-4.5c.3-.2.6-.2.9-.2m0-2c-1.3%200-2.6.5-3.6%201.3l2.6%205.1l-4.5%205l1%207l1.4-1.3c5.2-4.7%208.6-7.8%208.6-11.5C22%205.4%2019.6%203%2016.5%203%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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M7.5%205c.2%200%20.4%200%20.6.1l2.4%204.1l-3.7%204.6C5.1%2011.8%204%2010.2%204%208.5C4%206.5%205.5%205%207.5%205m0-2C4.4%203%202%205.4%202%208.5c0%203.8%203.4%206.9%208.6%2011.5l1.4%201.3l-3-7l4-5l-3.6-6C8.8%203.1%208.2%203%207.5%203m9%202c2%200%203.5%201.5%203.5%203.5c0%202.6-2.6%205.2-6.6%208.8l-.3-2.3l4.8-5.3l-2.3-4.5c.3-.2.6-.2.9-.2m0-2c-1.3%200-2.6.5-3.6%201.3l2.6%205.1l-4.5%205l1%207l1.4-1.3c5.2-4.7%208.6-7.8%208.6-11.5C22%205.4%2019.6%203%2016.5%203%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/mdi/heart-broken-outline.svg?color=%231a73e8&size=48