heartblue emoji

heartblue from Firefox OS Emoji by Mozilla · Default · People · Apache-2.0 Free for personal and commercial use.

Name: heartblue
Set: Firefox OS Emoji
Style: Default
Category: People
Viewbox: 512×512
License: Apache 2.0

More people icons from Firefox OS Emoji

Use the heartblue emoji

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="#20BFE8" d="M718.2-138.6c-54.1-64-150-67.1-208.1-9.2l-.2.2c-8 8-20.7 8-28.7 0l-.2-.2c-55-55.3-144.4-55.4-199.7-.4c-47 46.8-54.7 122.2-18.6 177.8C274 47 288.2 60.5 303.9 70.7l181.5 146.9c6.5 5.3 15.8 5.2 22.3 0L688.1 70.5c15.1-10 28.8-23.2 39.9-39.9c34.3-51.8 30.3-121.8-9.8-169.2"/><path fill="#84DFF3" d="M305.3-38.9c-.5 0-1 0-1.5-.1c-9.9-.8-17.2-9.5-16.4-19.4c3.7-45.2 36-82.3 80.3-92.2c9.7-2.2 19.3 3.9 21.4 13.6c2.2 9.7-3.9 19.3-13.6 21.4c-28.9 6.4-49.9 30.6-52.4 60.1c-.6 9.5-8.5 16.6-17.8 16.6"/></svg>

React

import type { SVGProps } from "react";

export function FxemojiHeartblue(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="#20BFE8" d="M718.2-138.6c-54.1-64-150-67.1-208.1-9.2l-.2.2c-8 8-20.7 8-28.7 0l-.2-.2c-55-55.3-144.4-55.4-199.7-.4c-47 46.8-54.7 122.2-18.6 177.8C274 47 288.2 60.5 303.9 70.7l181.5 146.9c6.5 5.3 15.8 5.2 22.3 0L688.1 70.5c15.1-10 28.8-23.2 39.9-39.9c34.3-51.8 30.3-121.8-9.8-169.2"/><path fill="#84DFF3" d="M305.3-38.9c-.5 0-1 0-1.5-.1c-9.9-.8-17.2-9.5-16.4-19.4c3.7-45.2 36-82.3 80.3-92.2c9.7-2.2 19.3 3.9 21.4 13.6c2.2 9.7-3.9 19.3-13.6 21.4c-28.9 6.4-49.9 30.6-52.4 60.1c-.6 9.5-8.5 16.6-17.8 16.6"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="#20BFE8" d="M718.2-138.6c-54.1-64-150-67.1-208.1-9.2l-.2.2c-8 8-20.7 8-28.7 0l-.2-.2c-55-55.3-144.4-55.4-199.7-.4c-47 46.8-54.7 122.2-18.6 177.8C274 47 288.2 60.5 303.9 70.7l181.5 146.9c6.5 5.3 15.8 5.2 22.3 0L688.1 70.5c15.1-10 28.8-23.2 39.9-39.9c34.3-51.8 30.3-121.8-9.8-169.2"/><path fill="#84DFF3" d="M305.3-38.9c-.5 0-1 0-1.5-.1c-9.9-.8-17.2-9.5-16.4-19.4c3.7-45.2 36-82.3 80.3-92.2c9.7-2.2 19.3 3.9 21.4 13.6c2.2 9.7-3.9 19.3-13.6 21.4c-28.9 6.4-49.9 30.6-52.4 60.1c-.6 9.5-8.5 16.6-17.8 16.6"/></svg>
</template>

CSS

.icon-heartblue {
  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%22%2320BFE8%22%20d%3D%22M718.2-138.6c-54.1-64-150-67.1-208.1-9.2l-.2.2c-8%208-20.7%208-28.7%200l-.2-.2c-55-55.3-144.4-55.4-199.7-.4c-47%2046.8-54.7%20122.2-18.6%20177.8C274%2047%20288.2%2060.5%20303.9%2070.7l181.5%20146.9c6.5%205.3%2015.8%205.2%2022.3%200L688.1%2070.5c15.1-10%2028.8-23.2%2039.9-39.9c34.3-51.8%2030.3-121.8-9.8-169.2%22%2F%3E%3Cpath%20fill%3D%22%2384DFF3%22%20d%3D%22M305.3-38.9c-.5%200-1%200-1.5-.1c-9.9-.8-17.2-9.5-16.4-19.4c3.7-45.2%2036-82.3%2080.3-92.2c9.7-2.2%2019.3%203.9%2021.4%2013.6c2.2%209.7-3.9%2019.3-13.6%2021.4c-28.9%206.4-49.9%2030.6-52.4%2060.1c-.6%209.5-8.5%2016.6-17.8%2016.6%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%22%2320BFE8%22%20d%3D%22M718.2-138.6c-54.1-64-150-67.1-208.1-9.2l-.2.2c-8%208-20.7%208-28.7%200l-.2-.2c-55-55.3-144.4-55.4-199.7-.4c-47%2046.8-54.7%20122.2-18.6%20177.8C274%2047%20288.2%2060.5%20303.9%2070.7l181.5%20146.9c6.5%205.3%2015.8%205.2%2022.3%200L688.1%2070.5c15.1-10%2028.8-23.2%2039.9-39.9c34.3-51.8%2030.3-121.8-9.8-169.2%22%2F%3E%3Cpath%20fill%3D%22%2384DFF3%22%20d%3D%22M305.3-38.9c-.5%200-1%200-1.5-.1c-9.9-.8-17.2-9.5-16.4-19.4c3.7-45.2%2036-82.3%2080.3-92.2c9.7-2.2%2019.3%203.9%2021.4%2013.6c2.2%209.7-3.9%2019.3-13.6%2021.4c-28.9%206.4-49.9%2030.6-52.4%2060.1c-.6%209.5-8.5%2016.6-17.8%2016.6%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fxemoji/heartblue.svg?color=%231a73e8&size=48