fog emoji

fog from Emoji One (Colored) by Emoji One · Default · Nature · CC-BY-4.0 Attribution required.

Name
fog
Set
Emoji One (Colored)
Style
Default
Category
Nature
Viewbox
64×64
License
CC BY 4.0

The same emoji in other sets

fogCarbonfogFluent EmojifogFluent Emoji FlatfogFluent Emoji High ContrastfogFirefox OS EmojifogIconParkfogIconPark OutlinefogIconoirfog-fillMingCute IconfogNoto EmojifogOpenMojifog-boldSolarfogTDesign IconsfogTwitter Emoji

More nature icons from Emoji One (Colored)

antbaby-chickbatbear-facebirdblossomblowfishboarbouquetbugbutterflycactuscamelcatcat-facecherry-blossomchickenchipmunkcloudcloud-with-lightningcloud-with-lightning-and-raincloud-with-raincloud-with-snowcollision

Use the fog emoji

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 64 64"><path fill="#979797" d="M2 29.6c15.8-12.6 23.3.5 32.8.5c7.5 0 16.8-13.1 27.2-2.4c-11.9-5.7-16.3 6.5-28.7 6.5c-9.5 0-13.2-11.3-31.3-4.6"/><path fill="#d0d0d0" d="M62 39.7c-9.2-7.6-15.1-1.4-22.7 1.8c-4.8 2-9.8 1.5-14.8-3.8c3.6 1.3 11.5 5.6 19.3-2c-6.7 3-15.1.9-21.9-2.5c-7.5-3.7-13.6-4.3-19.9 2.5c3.9-3 9.6-2.3 14-1.1c-2.8.1-8.9.8-14 8.7C17.4 30.5 23 48 35.1 48c11.7 0 10.6-13.1 26.9-8.3"/><path fill="#979797" d="M2 25.3c1.9-5.4 15.2-13.2 25.8.1C13 18.6 2 25.3 2 25.3"/><path fill="#d0d0d0" d="M42.1 19.8c6.2-6.8 16.1-3.1 19.9.3c-3.1-.4-12.5-2.4-16.5 2c-6.4 6.8-13.9 5.8-16.3 3.4c0-.1 7.6.2 12.9-5.7"/><path fill="#979797" d="M45.4 35.4c8-13.3 16.6-2.1 16.6-2.1c-9.4-3.3-16.6 2.1-16.6 2.1"/></svg>

React

import type { SVGProps } from "react";

export function EmojioneFog(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 64 64"><path fill="#979797" d="M2 29.6c15.8-12.6 23.3.5 32.8.5c7.5 0 16.8-13.1 27.2-2.4c-11.9-5.7-16.3 6.5-28.7 6.5c-9.5 0-13.2-11.3-31.3-4.6"/><path fill="#d0d0d0" d="M62 39.7c-9.2-7.6-15.1-1.4-22.7 1.8c-4.8 2-9.8 1.5-14.8-3.8c3.6 1.3 11.5 5.6 19.3-2c-6.7 3-15.1.9-21.9-2.5c-7.5-3.7-13.6-4.3-19.9 2.5c3.9-3 9.6-2.3 14-1.1c-2.8.1-8.9.8-14 8.7C17.4 30.5 23 48 35.1 48c11.7 0 10.6-13.1 26.9-8.3"/><path fill="#979797" d="M2 25.3c1.9-5.4 15.2-13.2 25.8.1C13 18.6 2 25.3 2 25.3"/><path fill="#d0d0d0" d="M42.1 19.8c6.2-6.8 16.1-3.1 19.9.3c-3.1-.4-12.5-2.4-16.5 2c-6.4 6.8-13.9 5.8-16.3 3.4c0-.1 7.6.2 12.9-5.7"/><path fill="#979797" d="M45.4 35.4c8-13.3 16.6-2.1 16.6-2.1c-9.4-3.3-16.6 2.1-16.6 2.1"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 64 64"><path fill="#979797" d="M2 29.6c15.8-12.6 23.3.5 32.8.5c7.5 0 16.8-13.1 27.2-2.4c-11.9-5.7-16.3 6.5-28.7 6.5c-9.5 0-13.2-11.3-31.3-4.6"/><path fill="#d0d0d0" d="M62 39.7c-9.2-7.6-15.1-1.4-22.7 1.8c-4.8 2-9.8 1.5-14.8-3.8c3.6 1.3 11.5 5.6 19.3-2c-6.7 3-15.1.9-21.9-2.5c-7.5-3.7-13.6-4.3-19.9 2.5c3.9-3 9.6-2.3 14-1.1c-2.8.1-8.9.8-14 8.7C17.4 30.5 23 48 35.1 48c11.7 0 10.6-13.1 26.9-8.3"/><path fill="#979797" d="M2 25.3c1.9-5.4 15.2-13.2 25.8.1C13 18.6 2 25.3 2 25.3"/><path fill="#d0d0d0" d="M42.1 19.8c6.2-6.8 16.1-3.1 19.9.3c-3.1-.4-12.5-2.4-16.5 2c-6.4 6.8-13.9 5.8-16.3 3.4c0-.1 7.6.2 12.9-5.7"/><path fill="#979797" d="M45.4 35.4c8-13.3 16.6-2.1 16.6-2.1c-9.4-3.3-16.6 2.1-16.6 2.1"/></svg>
</template>

CSS

.icon-fog {
  width: 24px;
  height: 24px;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2064%2064%22%3E%3Cpath%20fill%3D%22%23979797%22%20d%3D%22M2%2029.6c15.8-12.6%2023.3.5%2032.8.5c7.5%200%2016.8-13.1%2027.2-2.4c-11.9-5.7-16.3%206.5-28.7%206.5c-9.5%200-13.2-11.3-31.3-4.6%22%2F%3E%3Cpath%20fill%3D%22%23d0d0d0%22%20d%3D%22M62%2039.7c-9.2-7.6-15.1-1.4-22.7%201.8c-4.8%202-9.8%201.5-14.8-3.8c3.6%201.3%2011.5%205.6%2019.3-2c-6.7%203-15.1.9-21.9-2.5c-7.5-3.7-13.6-4.3-19.9%202.5c3.9-3%209.6-2.3%2014-1.1c-2.8.1-8.9.8-14%208.7C17.4%2030.5%2023%2048%2035.1%2048c11.7%200%2010.6-13.1%2026.9-8.3%22%2F%3E%3Cpath%20fill%3D%22%23979797%22%20d%3D%22M2%2025.3c1.9-5.4%2015.2-13.2%2025.8.1C13%2018.6%202%2025.3%202%2025.3%22%2F%3E%3Cpath%20fill%3D%22%23d0d0d0%22%20d%3D%22M42.1%2019.8c6.2-6.8%2016.1-3.1%2019.9.3c-3.1-.4-12.5-2.4-16.5%202c-6.4%206.8-13.9%205.8-16.3%203.4c0-.1%207.6.2%2012.9-5.7%22%2F%3E%3Cpath%20fill%3D%22%23979797%22%20d%3D%22M45.4%2035.4c8-13.3%2016.6-2.1%2016.6-2.1c-9.4-3.3-16.6%202.1-16.6%202.1%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2064%2064%22%3E%3Cpath%20fill%3D%22%23979797%22%20d%3D%22M2%2029.6c15.8-12.6%2023.3.5%2032.8.5c7.5%200%2016.8-13.1%2027.2-2.4c-11.9-5.7-16.3%206.5-28.7%206.5c-9.5%200-13.2-11.3-31.3-4.6%22%2F%3E%3Cpath%20fill%3D%22%23d0d0d0%22%20d%3D%22M62%2039.7c-9.2-7.6-15.1-1.4-22.7%201.8c-4.8%202-9.8%201.5-14.8-3.8c3.6%201.3%2011.5%205.6%2019.3-2c-6.7%203-15.1.9-21.9-2.5c-7.5-3.7-13.6-4.3-19.9%202.5c3.9-3%209.6-2.3%2014-1.1c-2.8.1-8.9.8-14%208.7C17.4%2030.5%2023%2048%2035.1%2048c11.7%200%2010.6-13.1%2026.9-8.3%22%2F%3E%3Cpath%20fill%3D%22%23979797%22%20d%3D%22M2%2025.3c1.9-5.4%2015.2-13.2%2025.8.1C13%2018.6%202%2025.3%202%2025.3%22%2F%3E%3Cpath%20fill%3D%22%23d0d0d0%22%20d%3D%22M42.1%2019.8c6.2-6.8%2016.1-3.1%2019.9.3c-3.1-.4-12.5-2.4-16.5%202c-6.4%206.8-13.9%205.8-16.3%203.4c0-.1%207.6.2%2012.9-5.7%22%2F%3E%3Cpath%20fill%3D%22%23979797%22%20d%3D%22M45.4%2035.4c8-13.3%2016.6-2.1%2016.6-2.1c-9.4-3.3-16.6%202.1-16.6%202.1%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/emojione/fog.svg?color=%231a73e8&size=48