Mic icon

flat-ui:mic

The Mic icon (flat-ui:mic) is a free SVG icon from the Flat UI Icons set by Designmodo, Inc.. It is drawn on a 100 × 100 grid. Flat UI 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: Flat UI Icons
Author: Designmodo, Inc.
License: MIT
Size: 100 × 100

Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100"><path fill="#EBF0F1" d="M49.985 0c27.619 0 50.009 22.39 50.009 50.009s-22.391 49.993-50.009 49.993S.007 77.628.007 50.009S22.366 0 49.985 0"/><defs><path id="SVG2k8lq8lf" d="M49.985 0c27.619 0 50.009 22.39 50.009 50.009s-22.391 49.993-50.009 49.993S.007 77.628.007 50.009S22.366 0 49.985 0"/><path id="SVGc8Be7cNI" d="M50.009 9.007c9.94 0 18 8.059 18 18v34c0 9.941-8.06 18-18 18c-9.941 0-18-8.059-18-18v-34c0-9.941 8.059-18 18-18"/></defs><clipPath id="SVGh6piEeSu"><use href="#SVG2k8lq8lf"/></clipPath><g clip-path="url(#SVGh6piEeSu)"><path fill="#1C3C50" d="M27.966 60.007h44.059v-4H28.001z"/><path fill="#23475F" d="M78.009 60.796v-7.062c0-1.508-1.526-2.729-3.022-2.729s-2.959 1.224-2.959 2.729v7.062c0 12.544-9.567 22.249-22.019 22.249S27.96 73.34 27.96 60.796l.062-7.062c0-1.508-1.557-2.729-3.054-2.729s-2.96 1.224-2.96 2.729v7.062c0 14.188 10.454 25.96 24.009 27.917v11.303H32.912v.016c-2.172.007-3.931 1.854-3.931 3.979s1.76 4.014 3.931 4.02h34.154v-.004c2.164-.017 3.912-1.897 3.912-4.018c0-2.117-1.748-3.959-3.912-3.976v-.019H54.003V88.713c13.554-1.959 24.006-13.729 24.006-27.917"/><path fill="#BCC4C8" d="M50.009 9.007c9.94 0 18 8.059 18 18v34c0 9.941-8.06 18-18 18c-9.941 0-18-8.059-18-18v-34c0-9.941 8.059-18 18-18"/><path fill="#1C3C50" d="M68.004 57.007v4H32.035v-3.999l-.026-.001v4c0 9.941 8.059 18 18 18c9.94 0 18-8.059 18-18v-4z"/><path fill="#DF3627" d="M32.035 55.007h35.969v6H32.035z"/><path fill="#A9B0B4" d="M32.009 27.007v34c0 9.941 8.059 18 18 18v-70c-9.941 0-18 8.059-18 18"/><path fill="#C83021" d="M32.035 55.007h17.974v6H32.035z"/><path fill="#193648" d="M32.035 61.007v-3.999l-.026-.001v4c0 9.941 8.059 18 18 18v-18z"/><defs><use href="#SVGc8Be7cNI" id="SVGpnNZObbb"/></defs><defs/><clipPath id="SVGuw57oeJZ"><use href="#SVGpnNZObbb"/></clipPath><clipPath id="SVGVW2Ekbtd" clip-path="url(#SVGuw57oeJZ)"><use href="#SVGpnNZObbb"/></clipPath><path fill="#7A8D8E" d="M78.009 44.007h-20a3 3 0 1 0 0 6h20a3 3 0 1 0 0-6m0-9h-20a3 3 0 1 0 0 6h20a3 3 0 1 0 0-6m0-9h-20a3 3 0 1 0 0 6h20a3 3 0 1 0 0-6m-20-3h20a3 3 0 1 0 0-6h-20a3 3 0 0 0 0 6" clip-path="url(#SVGVW2Ekbtd)"/><path fill="#1C3C50" d="M50.008 89.005a28 28 0 0 1-4-.292v2.295h8v-2.295a28 28 0 0 1-4 .292" clip-path="url(#SVGVW2Ekbtd)"/><path fill="#6E7F80" d="M42.009 44.007h-20a3 3 0 1 0 0 6h20a3 3 0 1 0 0-6m0-9h-20a3 3 0 1 0 0 6h20a3 3 0 1 0 0-6m0-9h-20a3 3 0 1 0 0 6h20a3 3 0 1 0 0-6m-20-3h20a3 3 0 1 0 0-6h-20a3 3 0 0 0 0 6" clip-path="url(#SVGVW2Ekbtd)"/></g></svg>

How to use the Mic icon

React

import { Icon } from "@iconify/react";

<Icon icon="flat-ui:mic" width="24" />

Vue

<script setup>
import { Icon } from "@iconify/vue";
</script>

<template>
  <Icon icon="flat-ui:mic" width="24" />
</template>

Svelte

<script>
  import Icon from "@iconify/svelte";
</script>

<Icon icon="flat-ui:mic" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[flat-ui--mic]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/flat-ui -->
<div class="i-flat-ui:mic"></div>

Web component

<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>

<iconify-icon icon="flat-ui:mic"></iconify-icon>

HTML image

<img src="https://iconyz.com/api/public/svg/flat-ui/mic.svg" alt="Mic icon" width="24" height="24">

Mic icon in other icon sets

Mic icon FAQ

Is the Mic icon free for commercial use?

Yes. Flat UI Icons are released under the MIT license, which allows use in personal and commercial projects.

How do I use the Mic icon in React?

Install @iconify/react and render <Icon icon="flat-ui:mic" />, or use “Copy code” on this page to get a standalone React component.

How do I add the Mic icon to a web page?

Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/flat-ui/mic.svg" alt="Mic icon">, or paste the SVG code inline to style it with CSS.

Browse all Flat UI Icons →