Smoke Detector icon
cbi:smoke-detector
The Smoke Detector icon (cbi:smoke-detector) is a free SVG icon from the Custom Brand Icons set by Emanuele & rchiileea. It is drawn on a 24 × 24 grid. Custom Brand Icons use the CC BY-NC-SA 4.0 license, which does not allow commercial use without separate permission from the author. Copy it as SVG, JSX, Vue or Svelte code, or download the SVG file.
- Icon set
- Custom Brand Icons
- Author
- Emanuele & rchiileea
- License
- CC-BY-NC-SA-4.0
- Size
- 24 × 24
- Tags
- smokedetector
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M2 2v4.324a2.16 2.16 0 0 0 1.75 2.123C4.03 10.386 4.79 13 6.846 13h10.309c2.054 0 2.816-2.613 3.095-4.553A2.16 2.16 0 0 0 22 6.324V2Zm3.25 6.5H7l.6 3h-.754c-.983 0-1.335-1.406-1.596-3m3.25 0h2.75v3H9.1Zm4.25 0h2.75l-.6 3h-2.15Zm4.25 0h1.75c-.261 1.594-.62 2.855-1.594 3h-.754Zm-6.941 5.977l-1.506.877s-.33.187-.602.54s-.497.969-.24 1.622c.276.7.59 1.114.594 1.332c.002.127-.031.277-.332.584l-1.807 1.843l2.363-1.035c.07-.03.088-.082.153-.115l.004.008c.005-.005.002-.01.007-.016c.387-.198.728-.415.922-.697c.229-.332.3-.717.27-1.05c-.06-.67-.434-1.188-.621-1.497c-.243-.4-.016-.853-.016-.853Zm3.908 0l-1.504.877s-.375.215-.684.617c-.308.402-.565 1.086-.273 1.826c.253.642.58 1.093.672 1.396c.046.152.052.251.011.387s-.146.324-.394.576L9.988 22l2.366-1.035c.07-.03.087-.08.152-.113l.004.006c.006-.007.007-.013.013-.02c.46-.232.852-.487 1.075-.81c.257-.375.336-.804.302-1.182c-.067-.757-.499-1.36-.722-1.729c-.314-.518-.02-1.1-.02-1.1Zm3.867.002l-1.502.875s-.33.187-.602.54s-.499.969-.242 1.622c.22.554.495.94.567 1.175c.035.119.04.184.01.284s-.111.249-.315.457l-1.807 1.844l2.366-1.036c.069-.03.086-.082.15-.115l.006.008c.007-.007.007-.015.013-.022c.383-.197.722-.41.915-.691c.228-.332.3-.717.271-1.05c-.06-.669-.436-1.188-.623-1.497c-.242-.4-.016-.855-.016-.855Z"/></svg>How to use the Smoke Detector icon
React
import { Icon } from "@iconify/react";
<Icon icon="cbi:smoke-detector" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="cbi:smoke-detector" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="cbi:smoke-detector" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[cbi--smoke-detector]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/cbi -->
<div class="i-cbi:smoke-detector"></div>Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="cbi:smoke-detector"></iconify-icon>HTML image
<img src="https://iconyz.com/api/public/svg/cbi/smoke-detector.svg" alt="Smoke Detector icon" width="24" height="24">Smoke Detector icon in other icon sets
Smoke Detector icon FAQ
Is the Smoke Detector icon free for commercial use?
No. Custom Brand Icons use the CC BY-NC-SA 4.0 license, which does not allow commercial use without separate permission from the author.
How do I use the Smoke Detector icon in React?
Install @iconify/react and render <Icon icon="cbi:smoke-detector" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Smoke Detector icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/cbi/smoke-detector.svg" alt="Smoke Detector icon">, or paste the SVG code inline to style it with CSS.