heart decoration emoji
heart-decoration from Noto Emoji by Google Inc · Default · Smileys & Emotion · Apache-2.0 Free for personal and commercial use.
- Name
- heart-decoration
- Set
- Noto Emoji
- Style
- Default
- Category
- Smileys & Emotion
- Viewbox
- 128×128
- License
- Apache 2.0
The same emoji in other sets
More smileys & emotion icons from Noto Emoji
alienalien-monsteranger-symbolangry-faceangry-face-with-hornsanguished-faceanxious-face-with-sweatastonished-facebeaming-face-with-smiling-eyesbeating-heartblack-heartblue-heartbroken-heartbrown-heartcat-with-tears-of-joycat-with-wry-smileclown-facecold-facecollisionconfounded-faceconfused-facecowboy-hat-facecracking-facecrying-cat
Use the heart decoration emoji
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 128 128"><path fill="#8e24aa" d="M116 4H12c-4.42 0-8 3.58-8 8v104c0 4.42 3.58 8 8 8h104c4.42 0 8-3.58 8-8V12c0-4.42-3.58-8-8-8"/><path fill="#ab47bc" d="M109.7 4H11.5A7.555 7.555 0 0 0 4 11.5v97.9c-.01 4.14 3.34 7.49 7.48 7.5h98.12c4.14.01 7.49-3.34 7.5-7.48V11.5c.09-4.05-3.13-7.41-7.18-7.5z"/><path fill="#fafafa" d="M39.7 12.9c0-2.3-1.6-3-10.8-2.7c-7.7.3-11.5 1.2-13.8 4s-2.9 8.5-3 15.3c0 4.8 0 9.3 2.5 9.3c3.4 0 3.4-7.9 6.2-12.3c5.4-8.7 18.9-10.6 18.9-13.6" opacity=".3"/><radialGradient id="SVGK3uFedlr" cx="-3364.513" cy="2296.505" r="44.47" fx="-3338.032" fy="2332.231" gradientTransform="matrix(0 -.93 1.07 0 -2389.6 -3096.14)" gradientUnits="userSpaceOnUse"><stop offset=".57" stop-color="#fafafa"/><stop offset="1" stop-color="#eee"/></radialGradient><path fill="url(#SVGK3uFedlr)" d="M86.4 22.9C70.1 22.9 64 42.5 64 42.5s-5.9-19.6-22.4-19.6c-12.4 0-26.5 9.8-21.3 32.2s43.6 50 43.6 50s.2-.1.2-.2c.01.08.05.15.1.2c0 0 38.3-27.7 43.5-50s-8.9-32.2-21.3-32.2"/></svg>
React
import type { SVGProps } from "react";
export function NotoHeartDecoration(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 128 128"><path fill="#8e24aa" d="M116 4H12c-4.42 0-8 3.58-8 8v104c0 4.42 3.58 8 8 8h104c4.42 0 8-3.58 8-8V12c0-4.42-3.58-8-8-8"/><path fill="#ab47bc" d="M109.7 4H11.5A7.555 7.555 0 0 0 4 11.5v97.9c-.01 4.14 3.34 7.49 7.48 7.5h98.12c4.14.01 7.49-3.34 7.5-7.48V11.5c.09-4.05-3.13-7.41-7.18-7.5z"/><path fill="#fafafa" d="M39.7 12.9c0-2.3-1.6-3-10.8-2.7c-7.7.3-11.5 1.2-13.8 4s-2.9 8.5-3 15.3c0 4.8 0 9.3 2.5 9.3c3.4 0 3.4-7.9 6.2-12.3c5.4-8.7 18.9-10.6 18.9-13.6" opacity=".3"/><radialGradient id="SVGK3uFedlr" cx="-3364.513" cy="2296.505" r="44.47" fx="-3338.032" fy="2332.231" gradientTransform="matrix(0 -.93 1.07 0 -2389.6 -3096.14)" gradientUnits="userSpaceOnUse"><stop offset=".57" stopColor="#fafafa"/><stop offset="1" stopColor="#eee"/></radialGradient><path fill="url(#SVGK3uFedlr)" d="M86.4 22.9C70.1 22.9 64 42.5 64 42.5s-5.9-19.6-22.4-19.6c-12.4 0-26.5 9.8-21.3 32.2s43.6 50 43.6 50s.2-.1.2-.2c.01.08.05.15.1.2c0 0 38.3-27.7 43.5-50s-8.9-32.2-21.3-32.2"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 128 128"><path fill="#8e24aa" d="M116 4H12c-4.42 0-8 3.58-8 8v104c0 4.42 3.58 8 8 8h104c4.42 0 8-3.58 8-8V12c0-4.42-3.58-8-8-8"/><path fill="#ab47bc" d="M109.7 4H11.5A7.555 7.555 0 0 0 4 11.5v97.9c-.01 4.14 3.34 7.49 7.48 7.5h98.12c4.14.01 7.49-3.34 7.5-7.48V11.5c.09-4.05-3.13-7.41-7.18-7.5z"/><path fill="#fafafa" d="M39.7 12.9c0-2.3-1.6-3-10.8-2.7c-7.7.3-11.5 1.2-13.8 4s-2.9 8.5-3 15.3c0 4.8 0 9.3 2.5 9.3c3.4 0 3.4-7.9 6.2-12.3c5.4-8.7 18.9-10.6 18.9-13.6" opacity=".3"/><radialGradient id="SVGK3uFedlr" cx="-3364.513" cy="2296.505" r="44.47" fx="-3338.032" fy="2332.231" gradientTransform="matrix(0 -.93 1.07 0 -2389.6 -3096.14)" gradientUnits="userSpaceOnUse"><stop offset=".57" stop-color="#fafafa"/><stop offset="1" stop-color="#eee"/></radialGradient><path fill="url(#SVGK3uFedlr)" d="M86.4 22.9C70.1 22.9 64 42.5 64 42.5s-5.9-19.6-22.4-19.6c-12.4 0-26.5 9.8-21.3 32.2s43.6 50 43.6 50s.2-.1.2-.2c.01.08.05.15.1.2c0 0 38.3-27.7 43.5-50s-8.9-32.2-21.3-32.2"/></svg> </template>
CSS
.icon-heart-decoration {
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%20128%20128%22%3E%3Cpath%20fill%3D%22%238e24aa%22%20d%3D%22M116%204H12c-4.42%200-8%203.58-8%208v104c0%204.42%203.58%208%208%208h104c4.42%200%208-3.58%208-8V12c0-4.42-3.58-8-8-8%22%2F%3E%3Cpath%20fill%3D%22%23ab47bc%22%20d%3D%22M109.7%204H11.5A7.555%207.555%200%200%200%204%2011.5v97.9c-.01%204.14%203.34%207.49%207.48%207.5h98.12c4.14.01%207.49-3.34%207.5-7.48V11.5c.09-4.05-3.13-7.41-7.18-7.5z%22%2F%3E%3Cpath%20fill%3D%22%23fafafa%22%20d%3D%22M39.7%2012.9c0-2.3-1.6-3-10.8-2.7c-7.7.3-11.5%201.2-13.8%204s-2.9%208.5-3%2015.3c0%204.8%200%209.3%202.5%209.3c3.4%200%203.4-7.9%206.2-12.3c5.4-8.7%2018.9-10.6%2018.9-13.6%22%20opacity%3D%22.3%22%2F%3E%3CradialGradient%20id%3D%22SVGK3uFedlr%22%20cx%3D%22-3364.513%22%20cy%3D%222296.505%22%20r%3D%2244.47%22%20fx%3D%22-3338.032%22%20fy%3D%222332.231%22%20gradientTransform%3D%22matrix(0%20-.93%201.07%200%20-2389.6%20-3096.14)%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%22.57%22%20stop-color%3D%22%23fafafa%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23eee%22%2F%3E%3C%2FradialGradient%3E%3Cpath%20fill%3D%22url(%23SVGK3uFedlr)%22%20d%3D%22M86.4%2022.9C70.1%2022.9%2064%2042.5%2064%2042.5s-5.9-19.6-22.4-19.6c-12.4%200-26.5%209.8-21.3%2032.2s43.6%2050%2043.6%2050s.2-.1.2-.2c.01.08.05.15.1.2c0%200%2038.3-27.7%2043.5-50s-8.9-32.2-21.3-32.2%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%20128%20128%22%3E%3Cpath%20fill%3D%22%238e24aa%22%20d%3D%22M116%204H12c-4.42%200-8%203.58-8%208v104c0%204.42%203.58%208%208%208h104c4.42%200%208-3.58%208-8V12c0-4.42-3.58-8-8-8%22%2F%3E%3Cpath%20fill%3D%22%23ab47bc%22%20d%3D%22M109.7%204H11.5A7.555%207.555%200%200%200%204%2011.5v97.9c-.01%204.14%203.34%207.49%207.48%207.5h98.12c4.14.01%207.49-3.34%207.5-7.48V11.5c.09-4.05-3.13-7.41-7.18-7.5z%22%2F%3E%3Cpath%20fill%3D%22%23fafafa%22%20d%3D%22M39.7%2012.9c0-2.3-1.6-3-10.8-2.7c-7.7.3-11.5%201.2-13.8%204s-2.9%208.5-3%2015.3c0%204.8%200%209.3%202.5%209.3c3.4%200%203.4-7.9%206.2-12.3c5.4-8.7%2018.9-10.6%2018.9-13.6%22%20opacity%3D%22.3%22%2F%3E%3CradialGradient%20id%3D%22SVGK3uFedlr%22%20cx%3D%22-3364.513%22%20cy%3D%222296.505%22%20r%3D%2244.47%22%20fx%3D%22-3338.032%22%20fy%3D%222332.231%22%20gradientTransform%3D%22matrix(0%20-.93%201.07%200%20-2389.6%20-3096.14)%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%22.57%22%20stop-color%3D%22%23fafafa%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23eee%22%2F%3E%3C%2FradialGradient%3E%3Cpath%20fill%3D%22url(%23SVGK3uFedlr)%22%20d%3D%22M86.4%2022.9C70.1%2022.9%2064%2042.5%2064%2042.5s-5.9-19.6-22.4-19.6c-12.4%200-26.5%209.8-21.3%2032.2s43.6%2050%2043.6%2050s.2-.1.2-.2c.01.08.05.15.1.2c0%200%2038.3-27.7%2043.5-50s-8.9-32.2-21.3-32.2%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/noto/heart-decoration.svg?color=%231a73e8&size=48
