Watchman icon

material-icon-theme:watchman

The Watchman icon (material-icon-theme:watchman) is a free SVG icon from the Material Icon Theme set by Material Extensions. It is drawn on a 420 × 419 grid. Material Icon Theme 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: Material Icon Theme
Author: Material Extensions
License: MIT
Size: 420 × 419

Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="420" height="419" viewBox="0 0 420 419"><circle cx="210" cy="209.5" r="188.15" fill="#fafafa" paint-order="stroke fill markers"/><path fill="#304ffe" d="M191.07 397.1c-35.512-4.049-66.779-16.485-95.318-37.913c-22.723-17.061-44.027-43.274-56.077-68.997l-3.932-8.393l25.692-26.37c14.13-14.505 27.522-28.059 29.758-30.12l4.067-3.748l12.5 11.364c16.495 14.996 26.818 23.219 41.05 32.697c14.94 9.95 23.867 14.578 35.877 18.597c22.823 7.637 42.099 5.991 66.082-5.642c17.83-8.65 44.399-28.24 66.179-48.797l8.878-8.38l29.147 29.137c16.03 16.025 29.147 29.84 29.147 30.7s-1.6 4.912-3.554 9.005c-18.398 38.533-49.46 69.834-87.797 88.466c-17.732 8.619-33.936 13.787-53.563 17.084c-10.16 1.708-38.005 2.465-48.137 1.31zm6.3-123.69c-17.457-3.809-39.276-16.397-63.835-36.829c-13.001-10.816-26.615-23.771-26.615-25.327c0-1.265 16.792-17.101 29.7-28.009c20.328-17.179 36.936-27.484 53.753-33.355c6.275-2.19 8.25-2.443 19.147-2.443c10.892 0 12.873.253 19.136 2.44c22.614 7.894 50.68 27.157 79.189 54.35c3.836 3.659 6.975 7.021 6.975 7.472c0 1.1-21.726 20.758-32.4 29.316c-19.403 15.557-41.794 28.276-56.169 31.907c-8.267 2.088-20.566 2.29-28.881.477zm37.472-20.429c14.201-7.184 18.451-9.747 19.779-11.925c1.556-2.552 1.692-4.934 1.692-29.774c0-24.91-.132-27.216-1.705-29.795c-1.34-2.2-5.607-4.783-20.022-12.124c-18.175-9.256-18.368-9.329-24.812-9.355c-6.44-.026-6.632.044-22.95 8.376c-10.12 5.168-17.582 9.58-19.38 11.462l-2.925 3.06l.003 27.237c.003 25.164.134 27.452 1.712 30.04c1.301 2.134 5.186 4.602 16.288 10.35c20.15 10.433 22.925 11.538 29.04 11.571c4.82.026 6.487-.627 23.28-9.123m-40.872-12.388c-7.315-3.808-13.914-7.538-14.665-8.29c-1.181-1.181-1.28-4.249-.736-22.667l.63-21.3l13.888-7.202c8.096-4.199 14.986-7.202 16.52-7.202c2.953 0 28.618 12.505 31.424 15.311c1.68 1.682 1.788 3.033 1.788 22.477v20.69l-3.46 2.183c-1.902 1.202-8.376 4.65-14.386 7.662c-8.03 4.025-11.825 5.448-14.315 5.37c-2.329-.075-7.546-2.273-16.688-7.032M29.5 263.432c-1.475-3.866-4.192-15.727-5.967-26.05c-2.405-13.986-2.19-43.337.424-58.05c2.41-13.562 4.216-20.627 5.613-21.959c.772-.736 7.977 6.088 27.938 26.459c14.794 15.098 26.902 27.655 26.906 27.906s-12.122 12.581-26.948 27.4L30.51 266.082zm333.59-24.851c-14.17-14.479-25.763-26.679-25.763-27.11c0-1.574 51.776-53.76 53.1-53.521c1.493.27 3.338 6.773 5.975 21.06c2.353 12.751 2.343 48.232-.017 61.072c-2.37 12.886-5.358 24.1-6.527 24.49c-.553.184-12.599-11.512-26.768-25.991M64.75 170.903c-26.893-26.902-29.95-30.252-29.354-32.175c1.335-4.308 8.33-18.529 12.565-25.546c28.808-47.732 75.832-79.809 131.42-89.647c15.231-2.696 45.201-2.944 59.361-.492c41.827 7.244 76.236 24.833 104.91 53.625c15.582 15.647 27.713 32.758 36.971 52.151c6.183 12.95 8.732 8.549-24.429 42.185c-15.984 16.213-29.386 29.61-29.782 29.768c-.396.16-5.695-4.244-11.775-9.786c-32.548-29.67-61.86-48.734-85.116-55.361c-7.771-2.215-9.327-2.357-22.05-2.009c-12.468.34-14.427.627-21.965 3.212c-23.775 8.152-49.675 26.108-80.457 55.78c-4.75 4.579-9.006 8.325-9.457 8.325s-14.329-13.513-30.839-30.029z"/></svg>

How to use the Watchman icon

React

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

<Icon icon="material-icon-theme:watchman" width="24" />

Vue

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

<template>
  <Icon icon="material-icon-theme:watchman" width="24" />
</template>

Svelte

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

<Icon icon="material-icon-theme:watchman" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[material-icon-theme--watchman]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/material-icon-theme -->
<div class="i-material-icon-theme:watchman"></div>

Web component

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

<iconify-icon icon="material-icon-theme:watchman"></iconify-icon>

HTML image

<img src="https://iconyz.com/api/public/svg/material-icon-theme/watchman.svg" alt="Watchman icon" width="24" height="24">

Watchman icon in other icon sets

Watchman icon FAQ

Is the Watchman icon free for commercial use?

Yes. Material Icon Theme icons are released under the MIT license, which allows use in personal and commercial projects.

How do I use the Watchman icon in React?

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

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

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

Browse all Material Icon Theme icons →