Heartribbon icon

fxemoji:heartribbon

The Heartribbon icon (fxemoji:heartribbon) is a free SVG icon from the Firefox OS Emoji set by Mozilla. It is drawn on a 512 × 512 grid. Firefox OS Emoji icons are released under the Apache 2.0 license, which allows use in personal and commercial projects. Copy it as SVG, JSX, Vue or Svelte code, or download the SVG file.

Icon set: Firefox OS Emoji
Author: Mozilla
License: Apache-2.0
Size: 512 × 512
Category: Objects

Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path fill="#FF473E" d="M488.293 270.397c-11.069 16.67-24.745 29.844-39.883 39.886l-180.374 147.13a17.64 17.64 0 0 1-22.251.042L64.28 310.535c-15.7-10.215-29.892-23.684-41.218-41.085c-36.19-55.598-28.492-131.013 18.55-177.79c55.301-54.989 144.694-54.82 199.785.429l.204.205c8.002 8.065 20.655 8.081 28.684.043l.163-.162c58.094-57.927 153.929-54.856 208.079 9.156c40.104 47.409 44.116 117.334 9.766 169.066"/><path fill="#FFD469" d="M512 174.077v57.765c0 6.96-5.642 12.601-12.601 12.601H253.731a75 75 0 0 1-1.898 3.641c-2.82 5.047-6.417 9.911-10.146 14.014c0 0-1.102 1.198-3.167 2.44c-2.062 1.261-5.105 2.455-8.907 2.947c-3.81.44-8.382.163-13.449-1.181l-7.846-2.295c-2.696-.93-5.401-1.668-8.168-2.788l-8.221-3.121c-2.703-.978-5.432-2.363-8.035-3.475a105 105 0 0 1-6.245-2.94v163.96c0 13.562-14.385 19.901-22.062 9.722l-19.989-26.5c-2.642-3.503-6.966-3.503-9.608 0l-19.989 26.5c-7.678 10.179-22.062 3.84-22.062-9.722v-163.96a105 105 0 0 1-6.245 2.94c-2.604 1.112-5.332 2.496-8.035 3.475l-8.221 3.121c-2.767 1.12-5.472 1.858-8.168 2.788l-7.846 2.295c-5.066 1.344-9.638 1.621-13.449 1.181c-3.802-.492-6.845-1.686-8.907-2.947c-2.065-1.242-3.167-2.44-3.167-2.44c-27.685-30.094-25.733-76.933 4.361-104.618c4.255-3.915 9.191-7.412 14.014-10.146c0 0 1.421-.794 3.77-1.329c2.353-.554 5.616-.739 9.382-.019c3.757.772 8.014 2.462 12.408 5.321l6.737 4.63c2.271 1.725 4.61 3.271 6.889 5.198l6.836 5.531c2.263 1.773 4.422 3.94 6.549 5.81c2.125 1.879 4.162 3.796 6.067 5.79c1.906 1.98 3.741 3.649 5.377 5.554a172 172 0 0 1 7.909 9.183l2.93 3.916c6.544 8.746 7.444 19.96 3.339 29.293h28.644c-3.973-9.038-3.27-19.87 2.807-28.548c.152-.217.383-.535.54-.746l2.93-3.916c1.887-2.352 4.6-5.611 7.909-9.183c1.635-1.905 3.47-3.574 5.377-5.554c1.904-1.994 3.942-3.911 6.067-5.79c2.126-1.869 4.286-4.036 6.549-5.81l6.836-5.531c2.279-1.928 4.618-3.474 6.889-5.198l6.737-4.63c4.393-2.859 8.65-4.549 12.408-5.321c3.766-.72 7.029-.535 9.382.019c2.35.536 3.77 1.329 3.77 1.329c9.955 5.562 18.121 13.085 24.298 21.811a5.3 5.3 0 0 1 2-.396h257.062a5.33 5.33 0 0 1 5.326 5.329"/><path fill="#FFB636" d="M166.308 222.212c0 19.613-15.9 35.513-35.513 35.513s-35.513-15.9-35.513-35.513s15.9-35.513 35.513-35.513s35.513 15.9 35.513 35.513"/><path fill="#FFE1AB" d="M110.201 217.817a5.5 5.5 0 0 1-5.082-7.6a25.2 25.2 0 0 1 10.581-12.186a5.5 5.5 0 1 1 5.586 9.476a14.3 14.3 0 0 0-5.999 6.908a5.5 5.5 0 0 1-5.086 3.402"/></svg>

How to use the Heartribbon icon

React

import { Icon } from "@iconify/react";

<Icon icon="fxemoji:heartribbon" width="24" />

Vue

<script setup>
import { Icon } from "@iconify/vue";
</script>

<template>
  <Icon icon="fxemoji:heartribbon" width="24" />
</template>

Svelte

<script>
  import Icon from "@iconify/svelte";
</script>

<Icon icon="fxemoji:heartribbon" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[fxemoji--heartribbon]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/fxemoji -->
<div class="i-fxemoji:heartribbon"></div>

Web component

<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>

<iconify-icon icon="fxemoji:heartribbon"></iconify-icon>

HTML image

<img src="https://iconyz.com/api/public/svg/fxemoji/heartribbon.svg" alt="Heartribbon icon" width="24" height="24">

Heartribbon icon FAQ

Is the Heartribbon icon free for commercial use?

Yes. Firefox OS Emoji icons are released under the Apache 2.0 license, which allows use in personal and commercial projects.

How do I use the Heartribbon icon in React?

Install @iconify/react and render <Icon icon="fxemoji:heartribbon" />, or use “Copy code” on this page to get a standalone React component.

How do I add the Heartribbon icon to a web page?

Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/fxemoji/heartribbon.svg" alt="Heartribbon icon">, or paste the SVG code inline to style it with CSS.

Browse all Firefox OS Emoji icons →