heart with ribbon emoji

heart-with-ribbon from Fluent Emoji High Contrast by Microsoft Corporation · Default · Smileys & Emotion · MIT Free for personal and commercial use.

Name
heart-with-ribbon
Set
Fluent Emoji High Contrast
Style
Default
Category
Smileys & Emotion
Viewbox
32×32
License
MIT

The same emoji in other sets

heart-with-ribbonEmoji One (Colored)heart-with-ribbonFluent Emojiheart-with-ribbonFluent Emoji Flatheart-with-ribbonNoto Emojiheart-with-ribbonOpenMojiheart-with-ribbonStreamline Emojisheart-with-ribbonTwitter Emoji

More smileys & emotion icons from Fluent Emoji High Contrast

alienalien-monsteranger-symbolangry-faceangry-face-with-hornsanguished-faceanxious-face-with-sweatastonished-facebeaming-face-with-smiling-eyesbeating-heartblack-heartblue-heartbombbroken-heartbrown-heartcat-with-tears-of-joycat-with-wry-smileclown-facecold-facecollisionconfounded-faceconfused-facecowboy-hat-facecrying-cat

Use the heart with ribbon emoji

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><g fill="currentColor"><path d="M4.145 8.303C5.54 6.842 7.522 6 9.846 6c2.317 0 4.045 1.016 5.182 1.99c.389.334.713.665.972.955c.26-.29.583-.621.972-.954C18.11 7.016 19.837 6 22.154 6c2.324 0 4.305.842 5.701 2.303C29.247 9.759 30 11.766 30 14c0 2.261-.91 4.45-2.176 6.411c-1.272 1.97-2.95 3.783-4.604 5.317a47.4 47.4 0 0 1-6.088 4.752a18 18 0 0 1-.597.37a2 2 0 0 1-.15.074a1 1 0 0 1-.092.032h-.002a1 1 0 0 1-.29.044c-.152 0-.268-.036-.292-.043h-.002a1 1 0 0 1-.242-.108l-.146-.085a18 18 0 0 1-.451-.284a47.4 47.4 0 0 1-6.087-4.752l-.106-.098l.84-1.961a37 37 0 0 0 1.597 1.464l.493 1.151c.348.81 1.226 1.077 1.927.809q.52.39.974.717c.6.429 1.099.764 1.448.99l.046.03l.046-.03c.35-.226.849-.561 1.448-.99a45 45 0 0 0 4.366-3.549c1.382-1.281 2.74-2.73 3.827-4.261H19v-5h8.925q.075-.505.075-1c0-1.783-.596-3.275-1.59-4.315C25.42 8.65 23.977 8 22.154 8c-1.692 0-2.976.734-3.88 1.51a8.7 8.7 0 0 0-1.049 1.078c-.096.117-.173.216-.24.303l-.062.078a4 4 0 0 1-.13.158a1.1 1.1 0 0 1-.29.24a1.015 1.015 0 0 1-1.17-.116c-.06-.05-.104-.1-.125-.124a4 4 0 0 1-.13-.158l-.062-.078c-.068-.087-.145-.186-.241-.303a8.6 8.6 0 0 0-1.048-1.079C12.822 8.734 11.538 8 9.847 8C8.022 8 6.58 8.65 5.59 9.685a5.6 5.6 0 0 0-1.316 2.324A4 4 0 0 0 4 12c-.726 0-1.391.258-1.91.687c.238-1.703.942-3.22 2.055-4.384"/><path d="M4 13c1.116 0 2.231.622 3 1.173V16.5a.5.5 0 0 0 1 0V15a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v1.5a.5.5 0 0 0 1 0v-2.327c.768-.55 1.884-1.173 3-1.173a2 2 0 0 1 2 2v5a2 2 0 0 1-2.07 2a3 3 0 0 1-.304-.023c-.968-.113-1.906-.64-2.585-1.12a10 10 0 0 1-.277-.204l-.026-.02C12.281 20.28 12 20 12 20a1 1 0 0 1-.524.88l.054.05c.143.127.347.302.599.495l.001.002l.027.02q.143.11.306.225c.692.49 1.727 1.096 2.877 1.276l.645 1.418a.5.5 0 0 1-.641.672l-.88-.352a.5.5 0 0 0-.65.278l-.366.915a.5.5 0 0 1-.924.011L10.428 21h-.857l-2.096 4.89a.5.5 0 0 1-.923-.01l-.366-.916a.5.5 0 0 0-.65-.278l-.88.352a.5.5 0 0 1-.64-.672l.644-1.418c1.15-.18 2.185-.786 2.877-1.276q.162-.115.306-.225l.027-.02l.001-.002a10 10 0 0 0 .653-.545A1 1 0 0 1 8 20s-.281.281-.738.633l-.026.02a9 9 0 0 1-.277.203c-.68.481-1.617 1.008-2.584 1.121A3 3 0 0 1 4 22a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2m2.437 7a8 8 0 0 0-.242-.168C5.495 19.365 4.7 19 4 19a1 1 0 1 0 0 2c.7 0 1.495-.365 2.195-.832q.127-.085.242-.168m7.126 0q.114.083.242.168c.7.467 1.496.832 2.195.832a1 1 0 1 0 0-2c-.7 0-1.495.365-2.195.832a8 8 0 0 0-.242.168"/></g></svg>

React

import type { SVGProps } from "react";

export function FluentEmojiHighContrastHeartWithRibbon(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><g fill="currentColor"><path d="M4.145 8.303C5.54 6.842 7.522 6 9.846 6c2.317 0 4.045 1.016 5.182 1.99c.389.334.713.665.972.955c.26-.29.583-.621.972-.954C18.11 7.016 19.837 6 22.154 6c2.324 0 4.305.842 5.701 2.303C29.247 9.759 30 11.766 30 14c0 2.261-.91 4.45-2.176 6.411c-1.272 1.97-2.95 3.783-4.604 5.317a47.4 47.4 0 0 1-6.088 4.752a18 18 0 0 1-.597.37a2 2 0 0 1-.15.074a1 1 0 0 1-.092.032h-.002a1 1 0 0 1-.29.044c-.152 0-.268-.036-.292-.043h-.002a1 1 0 0 1-.242-.108l-.146-.085a18 18 0 0 1-.451-.284a47.4 47.4 0 0 1-6.087-4.752l-.106-.098l.84-1.961a37 37 0 0 0 1.597 1.464l.493 1.151c.348.81 1.226 1.077 1.927.809q.52.39.974.717c.6.429 1.099.764 1.448.99l.046.03l.046-.03c.35-.226.849-.561 1.448-.99a45 45 0 0 0 4.366-3.549c1.382-1.281 2.74-2.73 3.827-4.261H19v-5h8.925q.075-.505.075-1c0-1.783-.596-3.275-1.59-4.315C25.42 8.65 23.977 8 22.154 8c-1.692 0-2.976.734-3.88 1.51a8.7 8.7 0 0 0-1.049 1.078c-.096.117-.173.216-.24.303l-.062.078a4 4 0 0 1-.13.158a1.1 1.1 0 0 1-.29.24a1.015 1.015 0 0 1-1.17-.116c-.06-.05-.104-.1-.125-.124a4 4 0 0 1-.13-.158l-.062-.078c-.068-.087-.145-.186-.241-.303a8.6 8.6 0 0 0-1.048-1.079C12.822 8.734 11.538 8 9.847 8C8.022 8 6.58 8.65 5.59 9.685a5.6 5.6 0 0 0-1.316 2.324A4 4 0 0 0 4 12c-.726 0-1.391.258-1.91.687c.238-1.703.942-3.22 2.055-4.384"/><path d="M4 13c1.116 0 2.231.622 3 1.173V16.5a.5.5 0 0 0 1 0V15a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v1.5a.5.5 0 0 0 1 0v-2.327c.768-.55 1.884-1.173 3-1.173a2 2 0 0 1 2 2v5a2 2 0 0 1-2.07 2a3 3 0 0 1-.304-.023c-.968-.113-1.906-.64-2.585-1.12a10 10 0 0 1-.277-.204l-.026-.02C12.281 20.28 12 20 12 20a1 1 0 0 1-.524.88l.054.05c.143.127.347.302.599.495l.001.002l.027.02q.143.11.306.225c.692.49 1.727 1.096 2.877 1.276l.645 1.418a.5.5 0 0 1-.641.672l-.88-.352a.5.5 0 0 0-.65.278l-.366.915a.5.5 0 0 1-.924.011L10.428 21h-.857l-2.096 4.89a.5.5 0 0 1-.923-.01l-.366-.916a.5.5 0 0 0-.65-.278l-.88.352a.5.5 0 0 1-.64-.672l.644-1.418c1.15-.18 2.185-.786 2.877-1.276q.162-.115.306-.225l.027-.02l.001-.002a10 10 0 0 0 .653-.545A1 1 0 0 1 8 20s-.281.281-.738.633l-.026.02a9 9 0 0 1-.277.203c-.68.481-1.617 1.008-2.584 1.121A3 3 0 0 1 4 22a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2m2.437 7a8 8 0 0 0-.242-.168C5.495 19.365 4.7 19 4 19a1 1 0 1 0 0 2c.7 0 1.495-.365 2.195-.832q.127-.085.242-.168m7.126 0q.114.083.242.168c.7.467 1.496.832 2.195.832a1 1 0 1 0 0-2c-.7 0-1.495.365-2.195.832a8 8 0 0 0-.242.168"/></g></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><g fill="currentColor"><path d="M4.145 8.303C5.54 6.842 7.522 6 9.846 6c2.317 0 4.045 1.016 5.182 1.99c.389.334.713.665.972.955c.26-.29.583-.621.972-.954C18.11 7.016 19.837 6 22.154 6c2.324 0 4.305.842 5.701 2.303C29.247 9.759 30 11.766 30 14c0 2.261-.91 4.45-2.176 6.411c-1.272 1.97-2.95 3.783-4.604 5.317a47.4 47.4 0 0 1-6.088 4.752a18 18 0 0 1-.597.37a2 2 0 0 1-.15.074a1 1 0 0 1-.092.032h-.002a1 1 0 0 1-.29.044c-.152 0-.268-.036-.292-.043h-.002a1 1 0 0 1-.242-.108l-.146-.085a18 18 0 0 1-.451-.284a47.4 47.4 0 0 1-6.087-4.752l-.106-.098l.84-1.961a37 37 0 0 0 1.597 1.464l.493 1.151c.348.81 1.226 1.077 1.927.809q.52.39.974.717c.6.429 1.099.764 1.448.99l.046.03l.046-.03c.35-.226.849-.561 1.448-.99a45 45 0 0 0 4.366-3.549c1.382-1.281 2.74-2.73 3.827-4.261H19v-5h8.925q.075-.505.075-1c0-1.783-.596-3.275-1.59-4.315C25.42 8.65 23.977 8 22.154 8c-1.692 0-2.976.734-3.88 1.51a8.7 8.7 0 0 0-1.049 1.078c-.096.117-.173.216-.24.303l-.062.078a4 4 0 0 1-.13.158a1.1 1.1 0 0 1-.29.24a1.015 1.015 0 0 1-1.17-.116c-.06-.05-.104-.1-.125-.124a4 4 0 0 1-.13-.158l-.062-.078c-.068-.087-.145-.186-.241-.303a8.6 8.6 0 0 0-1.048-1.079C12.822 8.734 11.538 8 9.847 8C8.022 8 6.58 8.65 5.59 9.685a5.6 5.6 0 0 0-1.316 2.324A4 4 0 0 0 4 12c-.726 0-1.391.258-1.91.687c.238-1.703.942-3.22 2.055-4.384"/><path d="M4 13c1.116 0 2.231.622 3 1.173V16.5a.5.5 0 0 0 1 0V15a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v1.5a.5.5 0 0 0 1 0v-2.327c.768-.55 1.884-1.173 3-1.173a2 2 0 0 1 2 2v5a2 2 0 0 1-2.07 2a3 3 0 0 1-.304-.023c-.968-.113-1.906-.64-2.585-1.12a10 10 0 0 1-.277-.204l-.026-.02C12.281 20.28 12 20 12 20a1 1 0 0 1-.524.88l.054.05c.143.127.347.302.599.495l.001.002l.027.02q.143.11.306.225c.692.49 1.727 1.096 2.877 1.276l.645 1.418a.5.5 0 0 1-.641.672l-.88-.352a.5.5 0 0 0-.65.278l-.366.915a.5.5 0 0 1-.924.011L10.428 21h-.857l-2.096 4.89a.5.5 0 0 1-.923-.01l-.366-.916a.5.5 0 0 0-.65-.278l-.88.352a.5.5 0 0 1-.64-.672l.644-1.418c1.15-.18 2.185-.786 2.877-1.276q.162-.115.306-.225l.027-.02l.001-.002a10 10 0 0 0 .653-.545A1 1 0 0 1 8 20s-.281.281-.738.633l-.026.02a9 9 0 0 1-.277.203c-.68.481-1.617 1.008-2.584 1.121A3 3 0 0 1 4 22a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2m2.437 7a8 8 0 0 0-.242-.168C5.495 19.365 4.7 19 4 19a1 1 0 1 0 0 2c.7 0 1.495-.365 2.195-.832q.127-.085.242-.168m7.126 0q.114.083.242.168c.7.467 1.496.832 2.195.832a1 1 0 1 0 0-2c-.7 0-1.495.365-2.195.832a8 8 0 0 0-.242.168"/></g></svg>
</template>

CSS

.icon-heart-with-ribbon {
  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%2032%2032%22%3E%3Cg%20fill%3D%22currentColor%22%3E%3Cpath%20d%3D%22M4.145%208.303C5.54%206.842%207.522%206%209.846%206c2.317%200%204.045%201.016%205.182%201.99c.389.334.713.665.972.955c.26-.29.583-.621.972-.954C18.11%207.016%2019.837%206%2022.154%206c2.324%200%204.305.842%205.701%202.303C29.247%209.759%2030%2011.766%2030%2014c0%202.261-.91%204.45-2.176%206.411c-1.272%201.97-2.95%203.783-4.604%205.317a47.4%2047.4%200%200%201-6.088%204.752a18%2018%200%200%201-.597.37a2%202%200%200%201-.15.074a1%201%200%200%201-.092.032h-.002a1%201%200%200%201-.29.044c-.152%200-.268-.036-.292-.043h-.002a1%201%200%200%201-.242-.108l-.146-.085a18%2018%200%200%201-.451-.284a47.4%2047.4%200%200%201-6.087-4.752l-.106-.098l.84-1.961a37%2037%200%200%200%201.597%201.464l.493%201.151c.348.81%201.226%201.077%201.927.809q.52.39.974.717c.6.429%201.099.764%201.448.99l.046.03l.046-.03c.35-.226.849-.561%201.448-.99a45%2045%200%200%200%204.366-3.549c1.382-1.281%202.74-2.73%203.827-4.261H19v-5h8.925q.075-.505.075-1c0-1.783-.596-3.275-1.59-4.315C25.42%208.65%2023.977%208%2022.154%208c-1.692%200-2.976.734-3.88%201.51a8.7%208.7%200%200%200-1.049%201.078c-.096.117-.173.216-.24.303l-.062.078a4%204%200%200%201-.13.158a1.1%201.1%200%200%201-.29.24a1.015%201.015%200%200%201-1.17-.116c-.06-.05-.104-.1-.125-.124a4%204%200%200%201-.13-.158l-.062-.078c-.068-.087-.145-.186-.241-.303a8.6%208.6%200%200%200-1.048-1.079C12.822%208.734%2011.538%208%209.847%208C8.022%208%206.58%208.65%205.59%209.685a5.6%205.6%200%200%200-1.316%202.324A4%204%200%200%200%204%2012c-.726%200-1.391.258-1.91.687c.238-1.703.942-3.22%202.055-4.384%22%2F%3E%3Cpath%20d%3D%22M4%2013c1.116%200%202.231.622%203%201.173V16.5a.5.5%200%200%200%201%200V15a1%201%200%200%201%201-1h2a1%201%200%200%201%201%201v1.5a.5.5%200%200%200%201%200v-2.327c.768-.55%201.884-1.173%203-1.173a2%202%200%200%201%202%202v5a2%202%200%200%201-2.07%202a3%203%200%200%201-.304-.023c-.968-.113-1.906-.64-2.585-1.12a10%2010%200%200%201-.277-.204l-.026-.02C12.281%2020.28%2012%2020%2012%2020a1%201%200%200%201-.524.88l.054.05c.143.127.347.302.599.495l.001.002l.027.02q.143.11.306.225c.692.49%201.727%201.096%202.877%201.276l.645%201.418a.5.5%200%200%201-.641.672l-.88-.352a.5.5%200%200%200-.65.278l-.366.915a.5.5%200%200%201-.924.011L10.428%2021h-.857l-2.096%204.89a.5.5%200%200%201-.923-.01l-.366-.916a.5.5%200%200%200-.65-.278l-.88.352a.5.5%200%200%201-.64-.672l.644-1.418c1.15-.18%202.185-.786%202.877-1.276q.162-.115.306-.225l.027-.02l.001-.002a10%2010%200%200%200%20.653-.545A1%201%200%200%201%208%2020s-.281.281-.738.633l-.026.02a9%209%200%200%201-.277.203c-.68.481-1.617%201.008-2.584%201.121A3%203%200%200%201%204%2022a2%202%200%200%201-2-2v-5a2%202%200%200%201%202-2m2.437%207a8%208%200%200%200-.242-.168C5.495%2019.365%204.7%2019%204%2019a1%201%200%201%200%200%202c.7%200%201.495-.365%202.195-.832q.127-.085.242-.168m7.126%200q.114.083.242.168c.7.467%201.496.832%202.195.832a1%201%200%201%200%200-2c-.7%200-1.495.365-2.195.832a8%208%200%200%200-.242.168%22%2F%3E%3C%2Fg%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%2032%2032%22%3E%3Cg%20fill%3D%22currentColor%22%3E%3Cpath%20d%3D%22M4.145%208.303C5.54%206.842%207.522%206%209.846%206c2.317%200%204.045%201.016%205.182%201.99c.389.334.713.665.972.955c.26-.29.583-.621.972-.954C18.11%207.016%2019.837%206%2022.154%206c2.324%200%204.305.842%205.701%202.303C29.247%209.759%2030%2011.766%2030%2014c0%202.261-.91%204.45-2.176%206.411c-1.272%201.97-2.95%203.783-4.604%205.317a47.4%2047.4%200%200%201-6.088%204.752a18%2018%200%200%201-.597.37a2%202%200%200%201-.15.074a1%201%200%200%201-.092.032h-.002a1%201%200%200%201-.29.044c-.152%200-.268-.036-.292-.043h-.002a1%201%200%200%201-.242-.108l-.146-.085a18%2018%200%200%201-.451-.284a47.4%2047.4%200%200%201-6.087-4.752l-.106-.098l.84-1.961a37%2037%200%200%200%201.597%201.464l.493%201.151c.348.81%201.226%201.077%201.927.809q.52.39.974.717c.6.429%201.099.764%201.448.99l.046.03l.046-.03c.35-.226.849-.561%201.448-.99a45%2045%200%200%200%204.366-3.549c1.382-1.281%202.74-2.73%203.827-4.261H19v-5h8.925q.075-.505.075-1c0-1.783-.596-3.275-1.59-4.315C25.42%208.65%2023.977%208%2022.154%208c-1.692%200-2.976.734-3.88%201.51a8.7%208.7%200%200%200-1.049%201.078c-.096.117-.173.216-.24.303l-.062.078a4%204%200%200%201-.13.158a1.1%201.1%200%200%201-.29.24a1.015%201.015%200%200%201-1.17-.116c-.06-.05-.104-.1-.125-.124a4%204%200%200%201-.13-.158l-.062-.078c-.068-.087-.145-.186-.241-.303a8.6%208.6%200%200%200-1.048-1.079C12.822%208.734%2011.538%208%209.847%208C8.022%208%206.58%208.65%205.59%209.685a5.6%205.6%200%200%200-1.316%202.324A4%204%200%200%200%204%2012c-.726%200-1.391.258-1.91.687c.238-1.703.942-3.22%202.055-4.384%22%2F%3E%3Cpath%20d%3D%22M4%2013c1.116%200%202.231.622%203%201.173V16.5a.5.5%200%200%200%201%200V15a1%201%200%200%201%201-1h2a1%201%200%200%201%201%201v1.5a.5.5%200%200%200%201%200v-2.327c.768-.55%201.884-1.173%203-1.173a2%202%200%200%201%202%202v5a2%202%200%200%201-2.07%202a3%203%200%200%201-.304-.023c-.968-.113-1.906-.64-2.585-1.12a10%2010%200%200%201-.277-.204l-.026-.02C12.281%2020.28%2012%2020%2012%2020a1%201%200%200%201-.524.88l.054.05c.143.127.347.302.599.495l.001.002l.027.02q.143.11.306.225c.692.49%201.727%201.096%202.877%201.276l.645%201.418a.5.5%200%200%201-.641.672l-.88-.352a.5.5%200%200%200-.65.278l-.366.915a.5.5%200%200%201-.924.011L10.428%2021h-.857l-2.096%204.89a.5.5%200%200%201-.923-.01l-.366-.916a.5.5%200%200%200-.65-.278l-.88.352a.5.5%200%200%201-.64-.672l.644-1.418c1.15-.18%202.185-.786%202.877-1.276q.162-.115.306-.225l.027-.02l.001-.002a10%2010%200%200%200%20.653-.545A1%201%200%200%201%208%2020s-.281.281-.738.633l-.026.02a9%209%200%200%201-.277.203c-.68.481-1.617%201.008-2.584%201.121A3%203%200%200%201%204%2022a2%202%200%200%201-2-2v-5a2%202%200%200%201%202-2m2.437%207a8%208%200%200%200-.242-.168C5.495%2019.365%204.7%2019%204%2019a1%201%200%201%200%200%202c.7%200%201.495-.365%202.195-.832q.127-.085.242-.168m7.126%200q.114.083.242.168c.7.467%201.496.832%202.195.832a1%201%200%201%200%200-2c-.7%200-1.495.365-2.195.832a8%208%200%200%200-.242.168%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fluent-emoji-high-contrast/heart-with-ribbon.svg?color=%231a73e8&size=48