smoke icon

smoke-fill from Framework7 Icons by Vladimir Kharlampidi · Fill · MIT Free for personal and commercial use.

Name: smoke-fill
Set: Framework7 Icons
Style: Fill
Viewbox: 56×56
License: MIT

1 other variant in Framework7 Icons

The same icon in other sets

Use the smoke icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 56 56"><path fill="currentColor" d="M7.656 35.664c1.172-4.102 3.985-6.61 7.852-7.383c1.617-4.992 5.812-7.476 10.64-7.476c.54 0 1.055.047 1.524.117c1.898-2.79 4.828-4.172 8.578-4.125c-.773-2.016-2.977-3.75-6.492-3.75c-1.031 0-1.875.187-2.766.469c-1.922-2.79-4.969-4.524-8.437-4.524c-5.39 0-9.867 4.29-10.149 9.633c-4.125.844-7.148 4.383-7.148 8.672c0 3.844 2.344 7.148 6.398 8.367m10.805 11.344h27.117c5.484 0 9.164-3.89 9.164-8.79c0-4.288-3.047-7.85-7.148-8.671c-.281-5.32-4.664-9.656-10.078-9.656c-3.54 0-6.633 1.78-8.508 4.523a8.4 8.4 0 0 0-2.742-.445c-4.196 0-7.641 3.047-8.25 7.125c-4.36.164-7.805 3.68-7.805 7.968c0 4.43 3.305 7.946 8.25 7.946"/></svg>

React

import type { SVGProps } from "react";

export function F7SmokeFill(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 56 56"><path fill="currentColor" d="M7.656 35.664c1.172-4.102 3.985-6.61 7.852-7.383c1.617-4.992 5.812-7.476 10.64-7.476c.54 0 1.055.047 1.524.117c1.898-2.79 4.828-4.172 8.578-4.125c-.773-2.016-2.977-3.75-6.492-3.75c-1.031 0-1.875.187-2.766.469c-1.922-2.79-4.969-4.524-8.437-4.524c-5.39 0-9.867 4.29-10.149 9.633c-4.125.844-7.148 4.383-7.148 8.672c0 3.844 2.344 7.148 6.398 8.367m10.805 11.344h27.117c5.484 0 9.164-3.89 9.164-8.79c0-4.288-3.047-7.85-7.148-8.671c-.281-5.32-4.664-9.656-10.078-9.656c-3.54 0-6.633 1.78-8.508 4.523a8.4 8.4 0 0 0-2.742-.445c-4.196 0-7.641 3.047-8.25 7.125c-4.36.164-7.805 3.68-7.805 7.968c0 4.43 3.305 7.946 8.25 7.946"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 56 56"><path fill="currentColor" d="M7.656 35.664c1.172-4.102 3.985-6.61 7.852-7.383c1.617-4.992 5.812-7.476 10.64-7.476c.54 0 1.055.047 1.524.117c1.898-2.79 4.828-4.172 8.578-4.125c-.773-2.016-2.977-3.75-6.492-3.75c-1.031 0-1.875.187-2.766.469c-1.922-2.79-4.969-4.524-8.437-4.524c-5.39 0-9.867 4.29-10.149 9.633c-4.125.844-7.148 4.383-7.148 8.672c0 3.844 2.344 7.148 6.398 8.367m10.805 11.344h27.117c5.484 0 9.164-3.89 9.164-8.79c0-4.288-3.047-7.85-7.148-8.671c-.281-5.32-4.664-9.656-10.078-9.656c-3.54 0-6.633 1.78-8.508 4.523a8.4 8.4 0 0 0-2.742-.445c-4.196 0-7.641 3.047-8.25 7.125c-4.36.164-7.805 3.68-7.805 7.968c0 4.43 3.305 7.946 8.25 7.946"/></svg>
</template>

CSS

.icon-smoke-fill {
  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%2056%2056%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M7.656%2035.664c1.172-4.102%203.985-6.61%207.852-7.383c1.617-4.992%205.812-7.476%2010.64-7.476c.54%200%201.055.047%201.524.117c1.898-2.79%204.828-4.172%208.578-4.125c-.773-2.016-2.977-3.75-6.492-3.75c-1.031%200-1.875.187-2.766.469c-1.922-2.79-4.969-4.524-8.437-4.524c-5.39%200-9.867%204.29-10.149%209.633c-4.125.844-7.148%204.383-7.148%208.672c0%203.844%202.344%207.148%206.398%208.367m10.805%2011.344h27.117c5.484%200%209.164-3.89%209.164-8.79c0-4.288-3.047-7.85-7.148-8.671c-.281-5.32-4.664-9.656-10.078-9.656c-3.54%200-6.633%201.78-8.508%204.523a8.4%208.4%200%200%200-2.742-.445c-4.196%200-7.641%203.047-8.25%207.125c-4.36.164-7.805%203.68-7.805%207.968c0%204.43%203.305%207.946%208.25%207.946%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%2056%2056%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M7.656%2035.664c1.172-4.102%203.985-6.61%207.852-7.383c1.617-4.992%205.812-7.476%2010.64-7.476c.54%200%201.055.047%201.524.117c1.898-2.79%204.828-4.172%208.578-4.125c-.773-2.016-2.977-3.75-6.492-3.75c-1.031%200-1.875.187-2.766.469c-1.922-2.79-4.969-4.524-8.437-4.524c-5.39%200-9.867%204.29-10.149%209.633c-4.125.844-7.148%204.383-7.148%208.672c0%203.844%202.344%207.148%206.398%208.367m10.805%2011.344h27.117c5.484%200%209.164-3.89%209.164-8.79c0-4.288-3.047-7.85-7.148-8.671c-.281-5.32-4.664-9.656-10.078-9.656c-3.54%200-6.633%201.78-8.508%204.523a8.4%208.4%200%200%200-2.742-.445c-4.196%200-7.641%203.047-8.25%207.125c-4.36.164-7.805%203.68-7.805%207.968c0%204.43%203.305%207.946%208.25%207.946%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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