Foggy icon
fxemoji:foggy
The Foggy icon (fxemoji:foggy) 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
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path fill="#98D4FA" d="M500.951 489.617c0 6.6-5.4 12-12 12H21.716c-6.6 0-12-5.4-12-12V22.383c0-6.6 5.4-12 12-12H488.95c6.6 0 12 5.4 12 12"/><path fill="#2B3B47" d="M331.663 29.618h-3.531a3.18 3.18 0 0 0-3.182 3.182v121.078a3.18 3.18 0 0 0 3.182 3.182h3.531a3.18 3.18 0 0 0 3.182-3.182V32.8a3.18 3.18 0 0 0-3.182-3.182"/><path fill="#D1CFC3" d="M358.274 128.85h-56.753a6.2 6.2 0 0 0-6.198 6.198v128.414a6.2 6.2 0 0 0 6.198 6.198h23.797v157.052a2.946 2.946 0 0 0 2.946 2.946h3.269a2.946 2.946 0 0 0 2.946-2.946V269.661h23.797a6.2 6.2 0 0 0 6.198-6.198V135.048a6.2 6.2 0 0 0-6.2-6.198"/><path fill="#AAA9A2" d="M393.419 202.894v269.053a3.63 3.63 0 0 1-3.628 3.628H270.004a3.63 3.63 0 0 1-3.628-3.628V202.894a3.63 3.63 0 0 1 3.628-3.628h19.127a8.7 8.7 0 0 1-1.872-5.4v-37.944a8.76 8.76 0 0 1 8.759-8.759h9.719a8.76 8.76 0 0 1 8.759 8.759v37.944a8.7 8.7 0 0 1-1.872 5.4h12.694v227.446a2.946 2.946 0 0 0 2.946 2.946h3.269a2.946 2.946 0 0 0 2.946-2.946V199.266h12.694a8.7 8.7 0 0 1-1.872-5.4v-37.944a8.76 8.76 0 0 1 8.759-8.759h9.719a8.76 8.76 0 0 1 8.759 8.759v37.944a8.7 8.7 0 0 1-1.872 5.4h19.127a3.627 3.627 0 0 1 3.626 3.628m-48.845-74.044V91.01a9.44 9.44 0 0 0-9.439-9.439h-10.474a9.44 9.44 0 0 0-9.439 9.439v37.84z"/><path fill="#2B3B47" d="M489.548 305.081v167.204a3.29 3.29 0 0 1-3.29 3.29H377.639a3.29 3.29 0 0 1-3.29-3.29V305.081a3.29 3.29 0 0 1 3.29-3.29h108.619a3.29 3.29 0 0 1 3.29 3.29m-179.727-5.408H194.464a2.88 2.88 0 0 0-2.882 2.882v136.061a2.88 2.88 0 0 0 2.882 2.882h115.357a2.88 2.88 0 0 0 2.882-2.882V302.555a2.88 2.88 0 0 0-2.882-2.882"/><path fill="#597B91" d="M169.891 188.888v280.048a4.04 4.04 0 0 1-4.04 4.04H32.437a4.04 4.04 0 0 1-4.04-4.04V188.888a4.04 4.04 0 0 1 4.04-4.04h133.414a4.04 4.04 0 0 1 4.04 4.04m323.923 124.787v-8.408a3.476 3.476 0 0 0-3.476-3.476H372.705a3.476 3.476 0 0 0-3.476 3.476v8.408a3.476 3.476 0 0 0 3.476 3.476h117.633a3.476 3.476 0 0 0 3.476-3.476m0 68.849v-8.408a3.476 3.476 0 0 0-3.476-3.476H372.705a3.476 3.476 0 0 0-3.476 3.476v8.408a3.476 3.476 0 0 0 3.476 3.476h117.633a3.476 3.476 0 0 0 3.476-3.476m-203.696 12.721h-35.094v46.198h35.094zm-96.627-92.69h117.303a2.66 2.66 0 0 0 2.518-1.809l4.771-14.177a2.657 2.657 0 0 0-2.518-3.504H188.72a2.657 2.657 0 0 0-2.518 3.504l4.771 14.177a2.66 2.66 0 0 0 2.518 1.809"/><path fill="#464A4C" d="M170.862 203.713H26.377a4.27 4.27 0 0 1-4.27-4.27v-10.327a4.27 4.27 0 0 1 4.27-4.27h144.485a4.27 4.27 0 0 1 4.27 4.27v10.327a4.27 4.27 0 0 1-4.27 4.27m4.27 80.295v-10.327a4.27 4.27 0 0 0-4.27-4.27H26.377a4.27 4.27 0 0 0-4.27 4.27v10.327a4.27 4.27 0 0 0 4.27 4.27h144.485a4.27 4.27 0 0 0 4.27-4.27m0 137.588V411.27a4.27 4.27 0 0 0-4.27-4.27H26.377a4.27 4.27 0 0 0-4.27 4.27v10.327a4.27 4.27 0 0 0 4.27 4.27h144.485a4.27 4.27 0 0 0 4.27-4.271"/><path fill="#FFD469" d="M54.183 339.285h-8.394a2.327 2.327 0 0 1-2.327-2.327V311.19a2.327 2.327 0 0 1 2.327-2.327h8.394a2.327 2.327 0 0 1 2.327 2.327v25.768a2.327 2.327 0 0 1-2.327 2.327m26.906-1.778v-25.768a2.327 2.327 0 0 0-2.327-2.327h-8.394a2.327 2.327 0 0 0-2.327 2.327v25.768a2.327 2.327 0 0 0 2.327 2.327h8.394a2.327 2.327 0 0 0 2.327-2.327m24.579 0v-25.768a2.327 2.327 0 0 0-2.327-2.327h-8.394a2.327 2.327 0 0 0-2.327 2.327v25.768a2.327 2.327 0 0 0 2.327 2.327h8.394a2.327 2.327 0 0 0 2.327-2.327m24.579 0v-25.768a2.327 2.327 0 0 0-2.327-2.327h-8.394a2.327 2.327 0 0 0-2.327 2.327v25.768a2.327 2.327 0 0 0 2.327 2.327h8.394a2.327 2.327 0 0 0 2.327-2.327m24.579 0v-25.768a2.327 2.327 0 0 0-2.327-2.327h-8.394a2.327 2.327 0 0 0-2.327 2.327v25.768a2.327 2.327 0 0 0 2.327 2.327h8.394a2.327 2.327 0 0 0 2.327-2.327M56.51 251.086v-25.768a2.327 2.327 0 0 0-2.327-2.327h-8.394a2.327 2.327 0 0 0-2.327 2.327v25.768a2.327 2.327 0 0 0 2.327 2.327h8.394a2.327 2.327 0 0 0 2.327-2.327m24.579 0v-25.768a2.327 2.327 0 0 0-2.327-2.327h-8.394a2.327 2.327 0 0 0-2.327 2.327v25.768a2.327 2.327 0 0 0 2.327 2.327h8.394a2.327 2.327 0 0 0 2.327-2.327m24.579 0v-25.768a2.327 2.327 0 0 0-2.327-2.327h-8.394a2.327 2.327 0 0 0-2.327 2.327v25.768a2.327 2.327 0 0 0 2.327 2.327h8.394a2.327 2.327 0 0 0 2.327-2.327m24.579 0v-25.768a2.327 2.327 0 0 0-2.327-2.327h-8.394a2.327 2.327 0 0 0-2.327 2.327v25.768a2.327 2.327 0 0 0 2.327 2.327h8.394a2.327 2.327 0 0 0 2.327-2.327m24.579 0v-25.768a2.327 2.327 0 0 0-2.327-2.327h-8.394a2.327 2.327 0 0 0-2.327 2.327v25.768a2.327 2.327 0 0 0 2.327 2.327h8.394a2.327 2.327 0 0 0 2.327-2.327M56.51 385.376v-25.768a2.327 2.327 0 0 0-2.327-2.327h-8.394a2.327 2.327 0 0 0-2.327 2.327v25.768a2.327 2.327 0 0 0 2.327 2.327h8.394a2.327 2.327 0 0 0 2.327-2.327m24.579 0v-25.768a2.327 2.327 0 0 0-2.327-2.327h-8.394a2.327 2.327 0 0 0-2.327 2.327v25.768a2.327 2.327 0 0 0 2.327 2.327h8.394a2.327 2.327 0 0 0 2.327-2.327m24.579 0v-25.768a2.327 2.327 0 0 0-2.327-2.327h-8.394a2.327 2.327 0 0 0-2.327 2.327v25.768a2.327 2.327 0 0 0 2.327 2.327h8.394a2.327 2.327 0 0 0 2.327-2.327m24.579 0v-25.768a2.327 2.327 0 0 0-2.327-2.327h-8.394a2.327 2.327 0 0 0-2.327 2.327v25.768a2.327 2.327 0 0 0 2.327 2.327h8.394a2.327 2.327 0 0 0 2.327-2.327m24.579 0v-25.768a2.327 2.327 0 0 0-2.327-2.327h-8.394a2.327 2.327 0 0 0-2.327 2.327v25.768a2.327 2.327 0 0 0 2.327 2.327h8.394a2.327 2.327 0 0 0 2.327-2.327m254.712-31.309v-18.035a3.385 3.385 0 0 0-3.385-3.385h-12.211a3.385 3.385 0 0 0-3.385 3.385v18.035a3.385 3.385 0 0 0 3.385 3.385h12.211a3.385 3.385 0 0 0 3.385-3.385m31.474 0v-18.035a3.385 3.385 0 0 0-3.385-3.385h-12.211a3.385 3.385 0 0 0-3.385 3.385v18.035a3.385 3.385 0 0 0 3.385 3.385h12.211a3.384 3.384 0 0 0 3.385-3.385m31.475 0v-18.035a3.385 3.385 0 0 0-3.385-3.385h-12.211a3.385 3.385 0 0 0-3.385 3.385v18.035a3.385 3.385 0 0 0 3.385 3.385h12.211a3.385 3.385 0 0 0 3.385-3.385m-231.263 17.822v-33.76a7.434 7.434 0 0 0-7.434-7.434h-16.083a7.434 7.434 0 0 0-7.434 7.434v33.76a7.434 7.434 0 0 0 7.434 7.434h16.083a7.434 7.434 0 0 0 7.434-7.434"/><path fill="#DEE2E2" d="M500.951 483.988H337.107c-6.228 8.153-16.047 13.418-27.099 13.418h-95.414a34 34 0 0 1-.607 4.212H21.716c-6.6 0-12-5.4-12-12v-81.043c10.428-17.114 29.264-28.542 50.77-28.542c22.648 0 42.331 12.676 52.355 31.317a44.5 44.5 0 0 1 17.386-3.51a44.48 44.48 0 0 1 28.585 10.35c.056-22.859 18.602-41.374 41.475-41.374c17.107 0 31.79 10.358 38.132 25.143c6.401-9.091 16.97-15.037 28.934-15.037c12.862 0 24.118 6.866 30.309 17.131c7.565-5.884 17.066-9.398 27.392-9.398c0-32.811 26.599-59.41 59.41-59.41c27.641 0 50.871 18.878 57.506 44.443a35.2 35.2 0 0 1 19.977-6.184c19.535 0 35.372 15.836 35.372 35.372c0 2.73-.32 5.384-.905 7.937a34 34 0 0 1 4.536-.789zm0-319.049a25.4 25.4 0 0 0-11.621 9.017c-4.592-10.441-15.02-17.735-27.157-17.735c-16.356 0-29.618 13.24-29.658 29.586a31.8 31.8 0 0 0-20.441-7.401c-17.641 0-31.941 14.3-31.941 31.941s14.3 31.941 31.941 31.941h88.877zM87.436 266.973c-2.019 0-3.979.25-5.855.713a25.3 25.3 0 0 0 .647-5.676c0-13.969-11.324-25.294-25.294-25.294c-8.521 0-16.052 4.218-20.635 10.674c-4.518-10.275-14.694-17.486-26.584-17.714v86.046h77.72c13.462 0 24.375-10.913 24.375-24.375c.001-13.461-10.912-24.374-24.374-24.374"/><path fill="#C2CDCE" d="M494.022 448.357c0-32.811-26.599-59.41-59.41-59.41c-27.641 0-50.871 18.878-57.506 44.443a35.2 35.2 0 0 0-19.977-6.184c-19.535 0-35.372 15.836-35.372 35.372c0 2.73.32 5.384.905 7.937a34.2 34.2 0 0 0-8.188-.997c-.755 0-1.502.033-2.245.082a41.3 41.3 0 0 0-17.418-3.835c-16.973 0-31.557 10.2-37.978 24.801c-6.409-9.029-16.94-14.927-28.856-14.927c-12.862 0-24.118 6.866-30.309 17.131c-7.565-5.884-17.066-9.398-27.392-9.398c0-32.811-26.599-59.41-59.41-59.41c-27.641 0-50.871 18.878-57.506 44.443a35.2 35.2 0 0 0-19.977-6.184c-9.102 0-17.398 3.44-23.666 9.088v18.308c0 6.6 5.4 12 12 12h467.234c6.6 0 12-5.4 12-12v-40.723a45 45 0 0 0-6.929-.537"/></svg>How to use the Foggy icon
React
import { Icon } from "@iconify/react";
<Icon icon="fxemoji:foggy" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="fxemoji:foggy" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="fxemoji:foggy" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[fxemoji--foggy]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/fxemoji -->
<div class="i-fxemoji:foggy"></div>Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="fxemoji:foggy"></iconify-icon>HTML image
<img src="https://iconyz.com/api/public/svg/fxemoji/foggy.svg" alt="Foggy icon" width="24" height="24">Foggy icon in other icon sets
Foggy icon FAQ
Is the Foggy 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 Foggy icon in React?
Install @iconify/react and render <Icon icon="fxemoji:foggy" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Foggy icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/fxemoji/foggy.svg" alt="Foggy icon">, or paste the SVG code inline to style it with CSS.