ICONYZ
Français
Icône Sun With Face de Noto Emoji

Icône Sun With Face

noto:sun-with-face

L'icône Sun With Face (noto:sun-with-face) est une icône SVG gratuite de la collection Noto Emoji par Google Inc. Elle est dessinée sur une grille de 128 × 128. Les Noto Emoji icons sont publiées sous la licence Apache 2.0, 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
Noto Emoji
Auteur
Google Inc
Licence
Apache-2.0
Taille
128 × 128
Catégorie
Voyage et lieux
Mots-clés
sunwith, withface, sunwithface
Télécharger le SVG

Code SVG

<svg xmlns="http://www.w3.org/2000/svg" width="128" height="128" viewBox="0 0 128 128"><path fill="#FFB300" d="M126.99 80.89L108.1 64.13l.06-.3L127 47.14l-24.83-5.09l-.07-.12l8-24.05l-24.02 8.02l-.12-.08L80.86 1L64.01 20.03h-.02L47.11 1.01l-5.08 24.88l-.06.03l-24.07-8.04l8 24.05c-.04.04-.07.09-.11.13L1.01 47.11l19 16.87l-.01.05L1 80.86l24.89 5.11l.02.04l-8.02 24.11l24.05-8.03l.1.08l5.1 24.83l16.84-19.01h.05l16.87 19l5.07-24.86l.07-.04l24.09 8.02l-8.02-24.03l.07-.12z"/><radialGradient id="SVGPdqgibOn" cx="64" cy="64" r="75.481" gradientUnits="userSpaceOnUse"><stop offset=".556" stop-color="#FFB604"/><stop offset=".691" stop-color="#FEC61B"/><stop offset=".822" stop-color="#FDD835"/></radialGradient><path fill="url(#SVGPdqgibOn)" d="M126.99 80.89L108.1 64.13l.06-.3L127 47.14l-24.83-5.09l-.07-.12l8-24.05l-24.02 8.02l-.12-.08L80.86 1L64.01 20.03h-.02L47.11 1.01l-5.08 24.88l-.06.03l-24.07-8.04l8 24.05c-.04.04-.07.09-.11.13L1.01 47.11l19 16.87l-.01.05L1 80.86l24.89 5.11l.02.04l-8.02 24.11l24.05-8.03l.1.08l5.1 24.83l16.84-19.01h.05l16.87 19l5.07-24.86l.07-.04l24.09 8.02l-8.02-24.03l.07-.12z"/><circle cx="64" cy="64" r="42.46" fill="#FFB300"/><radialGradient id="SVGSBMcNbkY" cx="66.147" cy="100.924" r="66.57" gradientTransform="matrix(1 0 0 1.0876 0 -8.844)" gradientUnits="userSpaceOnUse"><stop offset=".694" stop-color="#FFB604"/><stop offset=".849" stop-color="#FEC61B"/><stop offset="1" stop-color="#FDD835"/></radialGradient><circle cx="64" cy="64" r="42.46" fill="url(#SVGSBMcNbkY)"/><g fill="#5D4037"><ellipse cx="46.8" cy="54.29" rx="5.25" ry="6.17"/><ellipse cx="81.2" cy="54.29" rx="5.25" ry="6.17"/></g><path fill="#5D4037" d="M75.81 75.67c-1.7 1.11-5.31 3.72-11.82 3.72S53.59 76.85 52 75.54c-.73-.61-1.66-1.1-2.34-.59s-.81 1.55-.33 2.29c1.84 2.85 6.71 7.13 14.65 7.27c7.94-.14 12.81-4.42 14.65-7.27c.4-.62.44-1.51-.03-1.99c-.61-.64-1.75-.26-2.79.42"/><path fill="#DE7321" d="M58.89 69.52c-1.39-1.42-.11-2.17 1.42-1.74c1.93.54 5.01.28 5.81-1.3c1.52-3.04-.38-4.76-2.74-10.02c-2.46-5.5.63-11.49 4.2-11.8c2.86-.24 1.91 1.12 1.01 1.7c-1.75 1.14-3.6 4.93-.77 9.17c4.82 7.21 4.82 10.62 2.33 14.06c-1.61 2.22-7.35 3.94-11.26-.07"/><radialGradient id="SVGjpGOWd4L" cx="-1858.159" cy="139.608" r="15.525" gradientTransform="matrix(-.7447 -.3192 -.3117 .736 -1297.374 -633.673)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#EF6C00"/><stop offset="1" stop-color="#EF6C00" stop-opacity="0"/></radialGradient><path fill="url(#SVGjpGOWd4L)" d="M50.38 71.89c-1.63 3.93-7.05 5.42-12.12 3.33c-5.06-2.09-7.85-6.98-6.22-10.91s7.05-5.42 12.12-3.33c5.06 2.09 7.85 6.98 6.22 10.91" opacity=".65"/><radialGradient id="SVGjt1BUc3J" cx="200.244" cy="-2.317" r="15.525" gradientTransform="matrix(.7447 -.3192 .3117 .736 -63.29 127.89)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#EF6C00"/><stop offset="1" stop-color="#EF6C00" stop-opacity="0"/></radialGradient><path fill="url(#SVGjt1BUc3J)" d="M77.62 71.89c1.63 3.93 7.05 5.42 12.12 3.33c5.06-2.09 7.85-6.98 6.22-10.91s-7.05-5.42-12.12-3.33c-5.06 2.09-7.85 6.98-6.22 10.91" opacity=".65"/></svg>

Comment utiliser l'icône Sun With Face

React

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

<Icon icon="noto:sun-with-face" width="24" />

Vue

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

<template>
  <Icon icon="noto:sun-with-face" width="24" />
</template>

Svelte

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

<Icon icon="noto:sun-with-face" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[noto--sun-with-face]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/noto -->
<div class="i-noto:sun-with-face"></div>

Web component

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

<iconify-icon icon="noto:sun-with-face"></iconify-icon>

Image HTML

<img src="https://iconyz.com/api/public/svg/noto/sun-with-face.svg" alt="Icône Sun With Face" width="24" height="24">

Icônes similaires dans Noto Emoji

L'icône Sun With Face dans d'autres collections

FAQ : Icône Sun With Face

L'icône Sun With Face est-elle gratuite pour un usage commercial ?

Oui. Les Noto Emoji icons sont publiées sous la licence Apache 2.0, qui autorise leur utilisation dans des projets personnels et commerciaux.

Comment utiliser l'icône Sun With Face dans React ?

Installez @iconify/react et affichez <Icon icon="noto:sun-with-face" />, ou utilisez « Copier le code » sur cette page pour obtenir un composant React autonome.

Comment ajouter l'icône Sun With Face à une page web ?

Liez le fichier SVG dans une balise image : <img src="https://iconyz.com/api/public/svg/noto/sun-with-face.svg" alt="Icône Sun With Face">, ou collez le code SVG directement dans la page pour le styliser en CSS.

Voir toutes les Icônes Noto Emoji →