Icône Heart Decoration
fluent-emoji:heart-decoration
L'icône Heart Decoration (fluent-emoji:heart-decoration) est une icône SVG gratuite de la collection Fluent Emoji par Microsoft Corporation. Elle est dessinée sur une grille de 32 × 32. Les Fluent Emoji icons sont publiées sous la licence MIT, qui autorise leur utilisation dans des projets personnels et commerciaux. Copiez-la en code SVG, JSX, Vue ou Svelte, ou téléchargez le fichier SVG.
- Collection
- Fluent Emoji
- Auteur
- Microsoft Corporation
- Licence
- MIT
- Taille
- 32 × 32
- Mots-clés
- heartdecoration
Code SVG
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><g fill="none"><rect width="28" height="28" x="2" y="2" fill="url(#iYg6mhc)" rx="4"/><path fill="url(#iA8SHze)" d="M2 26h28a4 4 0 0 1-4 4H6a4 4 0 0 1-4-4"/><path fill="url(#ibgsgyc)" d="M6 2v28a4 4 0 0 1-4-4V6a4 4 0 0 1 4-4"/><g filter="url(#ikeVkNd)" opacity=".2"><path fill="#fff" d="M5 4h23v1H5z"/></g><g filter="url(#id76tDe)" opacity=".2"><path fill="#fff" d="M27 4h1v22h-1z"/></g><g filter="url(#iz8TPxe)" opacity=".6"><circle cx="27" cy="5" r="1" fill="#fff"/></g><g filter="url(#i2dmvxb)"><path fill="#FFECFF" d="M19.32 8.886c-1.654.29-2.522 1.183-2.95 1.845c-.154.239-.644.264-.81.034c-.49-.674-1.41-1.607-2.884-1.868c-4.644-.825-6.561 3.277-5.792 6.317c1.089 4.264 6.105 8.108 8.196 9.553a1.6 1.6 0 0 0 1.836 0c2.09-1.445 7.108-5.29 8.197-9.563c.779-3.04-1.139-7.132-5.793-6.318"/><path fill="url(#iVmL7dc)" d="M19.32 8.886c-1.654.29-2.522 1.183-2.95 1.845c-.154.239-.644.264-.81.034c-.49-.674-1.41-1.607-2.884-1.868c-4.644-.825-6.561 3.277-5.792 6.317c1.089 4.264 6.105 8.108 8.196 9.553a1.6 1.6 0 0 0 1.836 0c2.09-1.445 7.108-5.29 8.197-9.563c.779-3.04-1.139-7.132-5.793-6.318"/></g><g filter="url(#iDf7SGe)"><path stroke="url(#iNKI2wb)" stroke-linecap="round" stroke-width=".5" d="M8.687 11.406c-.541.542-1.454 2.906 0 5.406c1.6 2.75 4.376 5.438 5.563 6.438"/></g><defs><linearGradient id="iYg6mhc" x1="28.5" x2="-3.063" y1="3.438" y2="35.75" gradientUnits="userSpaceOnUse"><stop stop-color="#B690FF"/><stop offset="1" stop-color="#5B46A2"/></linearGradient><linearGradient id="iA8SHze" x1="19" x2="19" y1="29" y2="26" gradientUnits="userSpaceOnUse"><stop stop-color="#6950BB"/><stop offset="1" stop-color="#6950BB" stop-opacity="0"/></linearGradient><linearGradient id="ibgsgyc" x1="3" x2="6" y1="19" y2="19" gradientUnits="userSpaceOnUse"><stop stop-color="#6950BB"/><stop offset="1" stop-color="#6950BB" stop-opacity="0"/></linearGradient><linearGradient id="iVmL7dc" x1="13.313" x2="17.563" y1="23" y2="21.125" gradientUnits="userSpaceOnUse"><stop stop-color="#F0E1FF"/><stop offset="1" stop-color="#F0E1FF" stop-opacity="0"/></linearGradient><linearGradient id="iNKI2wb" x1="12.125" x2="7.469" y1="20.75" y2="11.031" gradientUnits="userSpaceOnUse"><stop stop-color="#fff"/><stop offset="1" stop-color="#fff" stop-opacity="0"/></linearGradient><filter id="ikeVkNd" width="27" height="5" x="3" y="2" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_7000_5041" stdDeviation="1"/></filter><filter id="id76tDe" width="5" height="26" x="25" y="2" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_7000_5041" stdDeviation="1"/></filter><filter id="iz8TPxe" width="8" height="8" x="23" y="1" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_7000_5041" stdDeviation="1.5"/></filter><filter id="i2dmvxb" width="21.063" height="18.275" x="4.219" y="8.781" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dx="-2.5" dy="2"/><feGaussianBlur stdDeviation="2"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0.828719 0 0 0 0 0.697552 0 0 0 0 0.945833 0 0 0 1 0"/><feBlend in2="shape" result="effect1_innerShadow_7000_5041"/></filter><filter id="iDf7SGe" width="8.847" height="14.344" x="6.653" y="10.156" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_7000_5041" stdDeviation=".5"/></filter></defs></g></svg>
Comment utiliser l'icône Heart Decoration
React
import { Icon } from "@iconify/react";
<Icon icon="fluent-emoji:heart-decoration" width="24" />
Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="fluent-emoji:heart-decoration" width="24" />
</template>
Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="fluent-emoji:heart-decoration" width="24" />
Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[fluent-emoji--heart-decoration]"></span>
UnoCSS
<!-- @unocss/preset-icons + @iconify-json/fluent-emoji -->
<div class="i-fluent-emoji:heart-decoration"></div>
Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="fluent-emoji:heart-decoration"></iconify-icon>
Image HTML
<img src="https://iconyz.com/api/public/svg/fluent-emoji/heart-decoration.svg" alt="Icône Heart Decoration" width="24" height="24">
Icônes similaires dans Fluent Emoji
L'icône Heart Decoration dans d'autres collections
FAQ : Icône Heart Decoration
L'icône Heart Decoration est-elle gratuite pour un usage commercial ?
Oui. Les Fluent Emoji icons sont publiées sous la licence MIT, qui autorise leur utilisation dans des projets personnels et commerciaux.
Comment utiliser l'icône Heart Decoration dans React ?
Installez @iconify/react et affichez <Icon icon="fluent-emoji:heart-decoration" />, ou utilisez « Copier le code » sur cette page pour obtenir un composant React autonome.
Comment ajouter l'icône Heart Decoration à une page web ?
Liez le fichier SVG dans une balise image : <img src="https://iconyz.com/api/public/svg/fluent-emoji/heart-decoration.svg" alt="Icône Heart Decoration">, ou collez le code SVG directement dans la page pour le styliser en CSS.
Voir toutes les Icônes Fluent Emoji →
ICONYZ
