Blur Off icon
zmdi:blur-off
The Blur Off icon (zmdi:blur-off) is a free SVG icon from the Material Design Iconic Font set by MDI Community. It is drawn on a 408 × 416 grid. Material Design Iconic Font icons are released under the Open Font 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 Design Iconic Font
- Author
- MDI Community
- License
- OFL-1.1
- Size
- 408 × 416
- Tags
- bluroff
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="408" height="416" viewBox="0 0 408 416"><path fill="currentColor" d="M245.5 101q-8.5 0-15-6T224 80t6.5-15t15-6t15 6t6.5 15t-6.5 15t-15 6m-4.5 96q-11-2-18.5-9.5T214 170l-1-5q0-13 9.5-22.5t23-9.5t22.5 9.5t9 23t-9 22.5t-23 9zm4.5-170Q235 27 235 16t10.5-11T256 16t-10.5 11M160 27q-11 0-11-11t11-11t11 11t-11 11m234.5 149q-10.5 0-10.5-10.5t10.5-10.5t10.5 10.5t-10.5 10.5M160 101q-9 0-15-6t-6-15t6-15t15-6t15 6t6 15t-6 15t-15 6m170.5 171q-8.5 0-15-6.5t-6.5-15t6.5-15t15-6.5t15 6.5t6.5 15t-6.5 15t-15 6.5m0-85q-8.5 0-15-6.5t-6.5-15t6.5-15t15-6.5t15 6.5t6.5 15t-6.5 15t-15 6.5m0-86q-8.5 0-15-6T309 80t6.5-15t15-6t15 6t6.5 15t-6.5 15t-15 6m-85 288q10.5 0 10.5 11t-10.5 11t-10.5-11t10.5-11M0 64l27-27l346 347l-27 27l-81-81q2 4 2 6q0 9-6.5 15t-15 6t-15-6t-6.5-15t6.5-15t14.5-6q2 0 6 1l-60-60q-1 11-10 19t-21 8q-13 0-22.5-9.5T128 251q0-12 7.5-21t19.5-11l-60-60q1 4 1 6q0 9-6.5 15.5t-15 6.5t-15-6.5t-6.5-15t6.5-15T75 144l6 1zm160 251q9 0 15 6t6 15t-6 15t-15 6t-15-6t-6-15t6-15t15-6m234.5-75q10.5 0 10.5 10.5T394.5 261T384 250.5t10.5-10.5m-320-11q8.5 0 15 6.5t6.5 15t-6.5 15t-15 6.5t-15-6.5t-6.5-15t6.5-15t15-6.5m-64-74Q21 155 21 165.5T10.5 176T0 165.5T10.5 155M160 389q11 0 11 11t-11 11t-11-11t11-11m-85.5-74q8.5 0 15 6t6.5 15t-6.5 15t-15 6t-15-6t-6.5-15t6.5-15t15-6m-64-75Q21 240 21 250.5T10.5 261T0 250.5T10.5 240"/></svg>
How to use the Blur Off icon
React
import { Icon } from "@iconify/react";
<Icon icon="zmdi:blur-off" width="24" />
Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="zmdi:blur-off" width="24" />
</template>
Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="zmdi:blur-off" width="24" />
Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[zmdi--blur-off]"></span>
UnoCSS
<!-- @unocss/preset-icons + @iconify-json/zmdi -->
<div class="i-zmdi:blur-off"></div>
Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="zmdi:blur-off"></iconify-icon>
HTML image
<img src="https://iconyz.com/api/public/svg/zmdi/blur-off.svg" alt="Blur Off icon" width="24" height="24">
Related icons in Material Design Iconic Font
Blur Off icon in other icon sets
Blur Off icon FAQ
Is the Blur Off icon free for commercial use?
Yes. Material Design Iconic Font icons are released under the Open Font License, which allows use in personal and commercial projects.
How do I use the Blur Off icon in React?
Install @iconify/react and render <Icon icon="zmdi:blur-off" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Blur Off icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/zmdi/blur-off.svg" alt="Blur Off icon">, or paste the SVG code inline to style it with CSS.
Browse all Material Design Iconic Font icons →
ICONYZ
