Smoke Outline icon
glyphs:smoke-outline
The Smoke Outline icon (glyphs:smoke-outline) is a free SVG icon from the Glyphs set by Goran Spasojevic. It is drawn on a 80 × 80 grid. Glyphs icons are released under the MIT 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
- Glyphs
- Author
- Goran Spasojevic
- License
- MIT
- Size
- 80 × 80
- Tags
- smokeoutline
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="80" height="80" viewBox="0 0 80 80"><g fill="none"><path fill="currentColor" fill-opacity=".25" fill-rule="evenodd" d="M22 10A18 18 0 0 0 8.07 39.4q.052.518.142 1.028A18 18 0 0 0 22 70h36a14 14 0 0 0 11.425-22.091q.678-.556 1.303-1.181a18 18 0 0 0-19.149-29.544a16 16 0 0 0-16.538-1.591A18 18 0 0 0 22 10m30.095 11.306a14 14 0 0 0-5.11 4.052l-1.108 1.413l-1.524-.951a12 12 0 0 0-15.658 2.602l-.99 1.216l-1.418-.672a9.998 9.998 0 0 0-14.235 8.015L12.05 37a18 18 0 0 1 22.99 2.593a16 16 0 0 1 18.363 3.183A14 14 0 0 1 66.66 45q.65-.511 1.24-1.1a14 14 0 0 0-15.805-22.594M11.257 43.023l.931-1.01a14 14 0 0 1 20.826 1.345l1.109 1.413l1.524-.951a12 12 0 0 1 15.657 2.602l.991 1.216l1.418-.672a10 10 0 0 1 11.358 1.963l.026.026l.007.007A10 10 0 0 1 58 66H22a14 14 0 0 1-10.743-22.977m36.28-23.67a12 12 0 0 0-11.89.467l-.788.491a16 16 0 0 1 10.1 1.282q.154-.162.313-.321a18 18 0 0 1 2.264-1.918M33.93 20.527l-.917-1.168A14 14 0 0 0 8.923 33a14 14 0 0 1 17.674-8.224l.034-.034l.055-.056a16 16 0 0 1 7.245-4.16" clip-rule="evenodd"/><path stroke="currentColor" d="m34.859 20.311l.788-.491a12 12 0 0 1 11.89-.466a18 18 0 0 0-2.578 2.239a16 16 0 0 0-10.1-1.282Zm0 0l-.928.215m0 0l-.917-1.168A14 14 0 0 0 8.923 33a14 14 0 0 1 17.674-8.224l.034-.034l.055-.056a16 16 0 0 1 7.245-4.16ZM9.272 15.272a18 18 0 0 1 25.769.32a16 16 0 0 1 16.538 1.592a17.99 17.99 0 0 1 19.149 4.088a18 18 0 0 1-1.303 26.637A14 14 0 0 1 58 70H22A18 18 0 0 1 8.212 40.428q-.09-.51-.142-1.028a18 18 0 0 1 1.202-24.128Zm42.823 6.034a14 14 0 0 0-5.11 4.052l-1.108 1.413l-1.524-.951a12 12 0 0 0-15.658 2.602l-.99 1.216l-1.418-.672a9.998 9.998 0 0 0-14.235 8.015L12.05 37a18 18 0 0 1 22.99 2.593a16 16 0 0 1 18.363 3.183A14 14 0 0 1 66.66 45q.65-.511 1.24-1.1a14 14 0 0 0-15.805-22.594ZM12.188 42.013l-.931 1.01A14 14 0 0 0 22 66h36a10 10 0 0 0 7.104-17.038l-.007-.008l-.026-.025a10 10 0 0 0-11.358-1.963l-1.418.672l-.99-1.216A12 12 0 0 0 42 42a12 12 0 0 0-6.353 1.82l-1.524.95l-1.109-1.412A14 14 0 0 0 22 38a14 14 0 0 0-9.812 4.013Z"/></g></svg>How to use the Smoke Outline icon
React
import { Icon } from "@iconify/react";
<Icon icon="glyphs:smoke-outline" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="glyphs:smoke-outline" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="glyphs:smoke-outline" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[glyphs--smoke-outline]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/glyphs -->
<div class="i-glyphs:smoke-outline"></div>Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="glyphs:smoke-outline"></iconify-icon>HTML image
<img src="https://iconyz.com/api/public/svg/glyphs/smoke-outline.svg" alt="Smoke Outline icon" width="24" height="24">Related icons in Glyphs
Smoke Outline icon FAQ
Is the Smoke Outline icon free for commercial use?
Yes. Glyphs icons are released under the MIT license, which allows use in personal and commercial projects.
How do I use the Smoke Outline icon in React?
Install @iconify/react and render <Icon icon="glyphs:smoke-outline" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Smoke Outline icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/glyphs/smoke-outline.svg" alt="Smoke Outline icon">, or paste the SVG code inline to style it with CSS.