Sunwithface icon

fxemoji:sunwithface

The Sunwithface icon (fxemoji:sunwithface) 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: Nature

Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path fill="#FFC639" d="m266.755 33.379l43.16-29.48c9.14-6.243 21.694-2.879 26.488 7.097l22.638 47.111A18.075 18.075 0 0 0 376.7 68.302l52.118-3.951c11.037-.837 20.227 8.353 19.39 19.39l-3.951 52.118a18.08 18.08 0 0 0 10.195 17.659l47.111 22.638c9.977 4.794 13.34 17.348 7.097 26.488l-29.48 43.16a18.08 18.08 0 0 0 0 20.39l29.48 43.161c6.243 9.14 2.879 21.694-7.097 26.488l-47.111 22.638a18.075 18.075 0 0 0-10.195 17.659l3.951 52.118c.837 11.037-8.353 20.227-19.39 19.39l-52.118-3.951a18.08 18.08 0 0 0-17.659 10.195l-22.638 47.111c-4.794 9.977-17.348 13.34-26.488 7.097l-43.16-29.48a18.08 18.08 0 0 0-20.39 0l-43.161 29.48c-9.14 6.243-21.694 2.879-26.488-7.097l-22.638-47.111a18.075 18.075 0 0 0-17.659-10.195l-52.118 3.951c-11.037.837-20.227-8.353-19.39-19.39l3.951-52.118a18.08 18.08 0 0 0-10.195-17.659l-47.111-22.638c-9.977-4.794-13.34-17.348-7.097-26.488l29.48-43.161a18.08 18.08 0 0 0 0-20.39l-29.48-43.16c-6.243-9.14-2.879-21.694 7.097-26.488l47.111-22.638a18.075 18.075 0 0 0 10.195-17.659l-3.951-52.118c-.837-11.037 8.353-20.227 19.39-19.39l52.118 3.951a18.08 18.08 0 0 0 17.659-10.195l22.638-47.111c4.794-9.977 17.348-13.34 26.488-7.097l43.161 29.48a18.08 18.08 0 0 0 20.39 0"/><circle cx="256.56" cy="256" r="208.732" fill="#FFE564"/><path fill="#FFB636" d="M259.031 323.412h-.02c-12.192-.007-23.288-6.066-29.681-16.21a8.63 8.63 0 0 1 14.603-9.203c3.215 5.102 8.854 8.148 15.086 8.152h.01c6.24 0 11.892-3.05 15.119-8.16c2.545-4.03 7.878-5.232 11.906-2.688a8.63 8.63 0 0 1 2.688 11.906c-6.408 10.146-17.514 16.203-29.711 16.203m-65.322-142.813a8.63 8.63 0 0 0 1.892-12.058c-8.646-11.865-21.619-18.673-35.591-18.679h-.018c-13.979 0-26.965 6.806-35.628 18.673a8.63 8.63 0 0 0 1.882 12.06a8.63 8.63 0 0 0 12.06-1.882c5.377-7.366 13.281-11.59 21.688-11.59h.01c8.396.003 16.286 4.226 21.648 11.584a8.62 8.62 0 0 0 6.982 3.548a8.6 8.6 0 0 0 5.075-1.656m198.181 0a8.63 8.63 0 0 0 1.892-12.058c-8.646-11.865-21.618-18.673-35.59-18.679h-.019c-13.979 0-26.966 6.806-35.629 18.673a8.63 8.63 0 0 0 1.882 12.06a8.63 8.63 0 0 0 12.06-1.882c5.378-7.366 13.281-11.59 21.688-11.59h.011c8.396.004 16.286 4.226 21.648 11.584a8.62 8.62 0 0 0 6.981 3.548a8.6 8.6 0 0 0 5.076-1.656"/><path fill="#2B3B47" d="M179.977 224.548v28.116h-.042c0 .042.042.078.042.078c0 11.042-8.959 20-20 20s-20-8.959-20-20.022v-.057h-.086v-28.116h.241c.893-10.242 9.369-18.301 19.845-18.301c10.446 0 18.923 8.059 19.803 18.301h.197zm198.05 0c-.88-10.242-9.369-18.301-19.845-18.301c-10.433 0-18.923 8.059-19.803 18.301h-.241v28.116h.086v.057c0 11.063 8.959 20.022 19.958 20.022c11.042 0 20-8.959 20-20v-28.194h-.155zM291.65 383.127a8.631 8.631 0 0 0-10.444-13.744c-13.47 10.233-30.874 10.234-44.339.001a8.63 8.63 0 0 0-12.094 1.649a8.63 8.63 0 0 0 1.649 12.093c9.754 7.413 21.181 11.118 32.613 11.118c11.429 0 22.861-3.707 32.615-11.117"/></svg>

How to use the Sunwithface icon

React

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

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

Vue

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

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

Svelte

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

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

Tailwind CSS

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

UnoCSS

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

Web component

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

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

HTML image

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

Sunwithface icon FAQ

Is the Sunwithface 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 Sunwithface icon in React?

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

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

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

Browse all Firefox OS Emoji icons →