heart half icon

heart-half-sharp from IonIcons by Ben Sperry · Sharp · MIT Free for personal and commercial use.

Name
heart-half-sharp
Set
IonIcons
Style
Sharp
Viewbox
512×512
License
MIT

2 other variants in IonIcons

heart-halfheart-half-outline

The same icon in other sets

heart-halfBootstrap Iconsheart-halfMaterial Line Iconsheart-halfMaterial Design Iconsheart-half-fillMingCute Iconheart-halfPhosphor

Related icons in IonIcons

heart-brokenheart-circleheart-dislikeheart-dislike-circle

Use the heart half icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M352.92 64c-48.11 0-80.1 28-96.92 48.21C239.18 92 207.19 64 159.08 64C98.46 64 48.63 114.54 48 176.65c-.56 55.68 19.71 107 62 157c40.12 47.46 94.25 79.75 137 108.32l9 6l9-6c42.78-28.57 96.91-60.86 137-108.32c42.25-50 62.52-101.35 62-157C463.37 114.54 413.54 64 352.92 64m24.67 249c-31.78 37.6-74.68 65.75-112.52 90.59l-9.07 6V162.23l24.59-29.54C294.53 116 318.38 96 352.92 96c43.15 0 78.62 36.32 79.07 81a178.6 178.6 0 0 1-12.69 68.59c-9.03 22.84-22.67 44.91-41.71 67.41"/></svg>

React

import type { SVGProps } from "react";

export function IonHeartHalfSharp(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M352.92 64c-48.11 0-80.1 28-96.92 48.21C239.18 92 207.19 64 159.08 64C98.46 64 48.63 114.54 48 176.65c-.56 55.68 19.71 107 62 157c40.12 47.46 94.25 79.75 137 108.32l9 6l9-6c42.78-28.57 96.91-60.86 137-108.32c42.25-50 62.52-101.35 62-157C463.37 114.54 413.54 64 352.92 64m24.67 249c-31.78 37.6-74.68 65.75-112.52 90.59l-9.07 6V162.23l24.59-29.54C294.53 116 318.38 96 352.92 96c43.15 0 78.62 36.32 79.07 81a178.6 178.6 0 0 1-12.69 68.59c-9.03 22.84-22.67 44.91-41.71 67.41"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M352.92 64c-48.11 0-80.1 28-96.92 48.21C239.18 92 207.19 64 159.08 64C98.46 64 48.63 114.54 48 176.65c-.56 55.68 19.71 107 62 157c40.12 47.46 94.25 79.75 137 108.32l9 6l9-6c42.78-28.57 96.91-60.86 137-108.32c42.25-50 62.52-101.35 62-157C463.37 114.54 413.54 64 352.92 64m24.67 249c-31.78 37.6-74.68 65.75-112.52 90.59l-9.07 6V162.23l24.59-29.54C294.53 116 318.38 96 352.92 96c43.15 0 78.62 36.32 79.07 81a178.6 178.6 0 0 1-12.69 68.59c-9.03 22.84-22.67 44.91-41.71 67.41"/></svg>
</template>

CSS

.icon-heart-half-sharp {
  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%20fill%3D%22currentColor%22%20d%3D%22M352.92%2064c-48.11%200-80.1%2028-96.92%2048.21C239.18%2092%20207.19%2064%20159.08%2064C98.46%2064%2048.63%20114.54%2048%20176.65c-.56%2055.68%2019.71%20107%2062%20157c40.12%2047.46%2094.25%2079.75%20137%20108.32l9%206l9-6c42.78-28.57%2096.91-60.86%20137-108.32c42.25-50%2062.52-101.35%2062-157C463.37%20114.54%20413.54%2064%20352.92%2064m24.67%20249c-31.78%2037.6-74.68%2065.75-112.52%2090.59l-9.07%206V162.23l24.59-29.54C294.53%20116%20318.38%2096%20352.92%2096c43.15%200%2078.62%2036.32%2079.07%2081a178.6%20178.6%200%200%201-12.69%2068.59c-9.03%2022.84-22.67%2044.91-41.71%2067.41%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%20fill%3D%22currentColor%22%20d%3D%22M352.92%2064c-48.11%200-80.1%2028-96.92%2048.21C239.18%2092%20207.19%2064%20159.08%2064C98.46%2064%2048.63%20114.54%2048%20176.65c-.56%2055.68%2019.71%20107%2062%20157c40.12%2047.46%2094.25%2079.75%20137%20108.32l9%206l9-6c42.78-28.57%2096.91-60.86%20137-108.32c42.25-50%2062.52-101.35%2062-157C463.37%20114.54%20413.54%2064%20352.92%2064m24.67%20249c-31.78%2037.6-74.68%2065.75-112.52%2090.59l-9.07%206V162.23l24.59-29.54C294.53%20116%20318.38%2096%20352.92%2096c43.15%200%2078.62%2036.32%2079.07%2081a178.6%20178.6%200%200%201-12.69%2068.59c-9.03%2022.84-22.67%2044.91-41.71%2067.41%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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