image off icon
image-off-48 from Fluent UI System Color Icons by Microsoft Corporation · 48 · MIT Free for personal and commercial use.
- Name
- image-off-48
- Set
- Fluent UI System Color Icons
- Style
- 48
- Viewbox
- 48×48
- License
- MIT
4 other variants in Fluent UI System Color Icons
The same icon in other sets
Use the image off icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><g fill="none"><path fill="url(#SVG8sJ7543E1)" d="M6 12.25A6.25 6.25 0 0 1 12.25 6h23.5A6.25 6.25 0 0 1 42 12.25v23.5A6.25 6.25 0 0 1 35.75 42h-23.5A6.25 6.25 0 0 1 6 35.75z"/><path fill="url(#SVGZTeAjepU1)" d="m40.835 39.385l-14.36-14.36a3.5 3.5 0 0 0-4.95 0l-14.36 14.36A6.24 6.24 0 0 0 12.25 42h23.5a6.24 6.24 0 0 0 5.085-2.615"/><path fill="url(#SVGvsICmjNc1)" d="M27 17a4 4 0 1 1 8 0a4 4 0 0 1-8 0"/><path fill="url(#SVGAFHJje0q1)" d="M6 12.25A6.25 6.25 0 0 1 12.25 6h23.5A6.25 6.25 0 0 1 42 12.25v23.5A6.25 6.25 0 0 1 35.75 42h-23.5A6.25 6.25 0 0 1 6 35.75z"/><path fill="url(#SVGelPK2dAr1)" d="M4.44 4.44a1.5 1.5 0 0 1 2.12 0l37 37a1.5 1.5 0 0 1-2.12 2.12l-37-37a1.5 1.5 0 0 1 0-2.12"/><defs><linearGradient id="SVGZTeAjepU1" x1="19.19" x2="23.289" y1="24" y2="42.935" gradientUnits="userSpaceOnUse"><stop stop-color="#e7dede"/><stop offset="1" stop-color="#d3d3d3"/></linearGradient><linearGradient id="SVGvsICmjNc1" x1="29.4" x2="32.323" y1="12.111" y2="22.633" gradientUnits="userSpaceOnUse"><stop stop-color="#fdfdfd"/><stop offset="1" stop-color="#e4e4e4"/></linearGradient><linearGradient id="SVGAFHJje0q1" x1="42" x2="6" y1="6" y2="42" gradientUnits="userSpaceOnUse"><stop offset=".471" stop-opacity="0"/><stop offset=".485"/><stop offset=".569" stop-opacity=".021"/><stop offset=".618" stop-opacity="0"/></linearGradient><linearGradient id="SVGelPK2dAr1" x1="4" x2="36.5" y1="-3.5" y2="45.25" gradientUnits="userSpaceOnUse"><stop stop-color="#e82c41"/><stop offset="1" stop-color="#aa1d2d"/></linearGradient><radialGradient id="SVG8sJ7543E1" cx="0" cy="0" r="1" gradientTransform="rotate(51.687 10.639 -15.53)scale(99.5459 90.5437)" gradientUnits="userSpaceOnUse"><stop offset=".338" stop-color="#a9a9a9"/><stop offset=".695" stop-color="#898989"/></radialGradient></defs></g></svg>
React
import type { SVGProps } from "react";
export function FluentColorImageOff48(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><g fill="none"><path fill="url(#SVG8sJ7543E1)" d="M6 12.25A6.25 6.25 0 0 1 12.25 6h23.5A6.25 6.25 0 0 1 42 12.25v23.5A6.25 6.25 0 0 1 35.75 42h-23.5A6.25 6.25 0 0 1 6 35.75z"/><path fill="url(#SVGZTeAjepU1)" d="m40.835 39.385l-14.36-14.36a3.5 3.5 0 0 0-4.95 0l-14.36 14.36A6.24 6.24 0 0 0 12.25 42h23.5a6.24 6.24 0 0 0 5.085-2.615"/><path fill="url(#SVGvsICmjNc1)" d="M27 17a4 4 0 1 1 8 0a4 4 0 0 1-8 0"/><path fill="url(#SVGAFHJje0q1)" d="M6 12.25A6.25 6.25 0 0 1 12.25 6h23.5A6.25 6.25 0 0 1 42 12.25v23.5A6.25 6.25 0 0 1 35.75 42h-23.5A6.25 6.25 0 0 1 6 35.75z"/><path fill="url(#SVGelPK2dAr1)" d="M4.44 4.44a1.5 1.5 0 0 1 2.12 0l37 37a1.5 1.5 0 0 1-2.12 2.12l-37-37a1.5 1.5 0 0 1 0-2.12"/><defs><linearGradient id="SVGZTeAjepU1" x1="19.19" x2="23.289" y1="24" y2="42.935" gradientUnits="userSpaceOnUse"><stop stopColor="#e7dede"/><stop offset="1" stopColor="#d3d3d3"/></linearGradient><linearGradient id="SVGvsICmjNc1" x1="29.4" x2="32.323" y1="12.111" y2="22.633" gradientUnits="userSpaceOnUse"><stop stopColor="#fdfdfd"/><stop offset="1" stopColor="#e4e4e4"/></linearGradient><linearGradient id="SVGAFHJje0q1" x1="42" x2="6" y1="6" y2="42" gradientUnits="userSpaceOnUse"><stop offset=".471" stopOpacity="0"/><stop offset=".485"/><stop offset=".569" stopOpacity=".021"/><stop offset=".618" stopOpacity="0"/></linearGradient><linearGradient id="SVGelPK2dAr1" x1="4" x2="36.5" y1="-3.5" y2="45.25" gradientUnits="userSpaceOnUse"><stop stopColor="#e82c41"/><stop offset="1" stopColor="#aa1d2d"/></linearGradient><radialGradient id="SVG8sJ7543E1" cx="0" cy="0" r="1" gradientTransform="rotate(51.687 10.639 -15.53)scale(99.5459 90.5437)" gradientUnits="userSpaceOnUse"><stop offset=".338" stopColor="#a9a9a9"/><stop offset=".695" stopColor="#898989"/></radialGradient></defs></g></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><g fill="none"><path fill="url(#SVG8sJ7543E1)" d="M6 12.25A6.25 6.25 0 0 1 12.25 6h23.5A6.25 6.25 0 0 1 42 12.25v23.5A6.25 6.25 0 0 1 35.75 42h-23.5A6.25 6.25 0 0 1 6 35.75z"/><path fill="url(#SVGZTeAjepU1)" d="m40.835 39.385l-14.36-14.36a3.5 3.5 0 0 0-4.95 0l-14.36 14.36A6.24 6.24 0 0 0 12.25 42h23.5a6.24 6.24 0 0 0 5.085-2.615"/><path fill="url(#SVGvsICmjNc1)" d="M27 17a4 4 0 1 1 8 0a4 4 0 0 1-8 0"/><path fill="url(#SVGAFHJje0q1)" d="M6 12.25A6.25 6.25 0 0 1 12.25 6h23.5A6.25 6.25 0 0 1 42 12.25v23.5A6.25 6.25 0 0 1 35.75 42h-23.5A6.25 6.25 0 0 1 6 35.75z"/><path fill="url(#SVGelPK2dAr1)" d="M4.44 4.44a1.5 1.5 0 0 1 2.12 0l37 37a1.5 1.5 0 0 1-2.12 2.12l-37-37a1.5 1.5 0 0 1 0-2.12"/><defs><linearGradient id="SVGZTeAjepU1" x1="19.19" x2="23.289" y1="24" y2="42.935" gradientUnits="userSpaceOnUse"><stop stop-color="#e7dede"/><stop offset="1" stop-color="#d3d3d3"/></linearGradient><linearGradient id="SVGvsICmjNc1" x1="29.4" x2="32.323" y1="12.111" y2="22.633" gradientUnits="userSpaceOnUse"><stop stop-color="#fdfdfd"/><stop offset="1" stop-color="#e4e4e4"/></linearGradient><linearGradient id="SVGAFHJje0q1" x1="42" x2="6" y1="6" y2="42" gradientUnits="userSpaceOnUse"><stop offset=".471" stop-opacity="0"/><stop offset=".485"/><stop offset=".569" stop-opacity=".021"/><stop offset=".618" stop-opacity="0"/></linearGradient><linearGradient id="SVGelPK2dAr1" x1="4" x2="36.5" y1="-3.5" y2="45.25" gradientUnits="userSpaceOnUse"><stop stop-color="#e82c41"/><stop offset="1" stop-color="#aa1d2d"/></linearGradient><radialGradient id="SVG8sJ7543E1" cx="0" cy="0" r="1" gradientTransform="rotate(51.687 10.639 -15.53)scale(99.5459 90.5437)" gradientUnits="userSpaceOnUse"><stop offset=".338" stop-color="#a9a9a9"/><stop offset=".695" stop-color="#898989"/></radialGradient></defs></g></svg> </template>
CSS
.icon-image-off-48 {
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%2048%2048%22%3E%3Cg%20fill%3D%22none%22%3E%3Cpath%20fill%3D%22url(%23SVG8sJ7543E1)%22%20d%3D%22M6%2012.25A6.25%206.25%200%200%201%2012.25%206h23.5A6.25%206.25%200%200%201%2042%2012.25v23.5A6.25%206.25%200%200%201%2035.75%2042h-23.5A6.25%206.25%200%200%201%206%2035.75z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGZTeAjepU1)%22%20d%3D%22m40.835%2039.385l-14.36-14.36a3.5%203.5%200%200%200-4.95%200l-14.36%2014.36A6.24%206.24%200%200%200%2012.25%2042h23.5a6.24%206.24%200%200%200%205.085-2.615%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGvsICmjNc1)%22%20d%3D%22M27%2017a4%204%200%201%201%208%200a4%204%200%200%201-8%200%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGAFHJje0q1)%22%20d%3D%22M6%2012.25A6.25%206.25%200%200%201%2012.25%206h23.5A6.25%206.25%200%200%201%2042%2012.25v23.5A6.25%206.25%200%200%201%2035.75%2042h-23.5A6.25%206.25%200%200%201%206%2035.75z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGelPK2dAr1)%22%20d%3D%22M4.44%204.44a1.5%201.5%200%200%201%202.12%200l37%2037a1.5%201.5%200%200%201-2.12%202.12l-37-37a1.5%201.5%200%200%201%200-2.12%22%2F%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22SVGZTeAjepU1%22%20x1%3D%2219.19%22%20x2%3D%2223.289%22%20y1%3D%2224%22%20y2%3D%2242.935%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23e7dede%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23d3d3d3%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGvsICmjNc1%22%20x1%3D%2229.4%22%20x2%3D%2232.323%22%20y1%3D%2212.111%22%20y2%3D%2222.633%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23fdfdfd%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23e4e4e4%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGAFHJje0q1%22%20x1%3D%2242%22%20x2%3D%226%22%20y1%3D%226%22%20y2%3D%2242%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%22.471%22%20stop-opacity%3D%220%22%2F%3E%3Cstop%20offset%3D%22.485%22%2F%3E%3Cstop%20offset%3D%22.569%22%20stop-opacity%3D%22.021%22%2F%3E%3Cstop%20offset%3D%22.618%22%20stop-opacity%3D%220%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGelPK2dAr1%22%20x1%3D%224%22%20x2%3D%2236.5%22%20y1%3D%22-3.5%22%20y2%3D%2245.25%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23e82c41%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23aa1d2d%22%2F%3E%3C%2FlinearGradient%3E%3CradialGradient%20id%3D%22SVG8sJ7543E1%22%20cx%3D%220%22%20cy%3D%220%22%20r%3D%221%22%20gradientTransform%3D%22rotate(51.687%2010.639%20-15.53)scale(99.5459%2090.5437)%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%22.338%22%20stop-color%3D%22%23a9a9a9%22%2F%3E%3Cstop%20offset%3D%22.695%22%20stop-color%3D%22%23898989%22%2F%3E%3C%2FradialGradient%3E%3C%2Fdefs%3E%3C%2Fg%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%2048%2048%22%3E%3Cg%20fill%3D%22none%22%3E%3Cpath%20fill%3D%22url(%23SVG8sJ7543E1)%22%20d%3D%22M6%2012.25A6.25%206.25%200%200%201%2012.25%206h23.5A6.25%206.25%200%200%201%2042%2012.25v23.5A6.25%206.25%200%200%201%2035.75%2042h-23.5A6.25%206.25%200%200%201%206%2035.75z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGZTeAjepU1)%22%20d%3D%22m40.835%2039.385l-14.36-14.36a3.5%203.5%200%200%200-4.95%200l-14.36%2014.36A6.24%206.24%200%200%200%2012.25%2042h23.5a6.24%206.24%200%200%200%205.085-2.615%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGvsICmjNc1)%22%20d%3D%22M27%2017a4%204%200%201%201%208%200a4%204%200%200%201-8%200%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGAFHJje0q1)%22%20d%3D%22M6%2012.25A6.25%206.25%200%200%201%2012.25%206h23.5A6.25%206.25%200%200%201%2042%2012.25v23.5A6.25%206.25%200%200%201%2035.75%2042h-23.5A6.25%206.25%200%200%201%206%2035.75z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGelPK2dAr1)%22%20d%3D%22M4.44%204.44a1.5%201.5%200%200%201%202.12%200l37%2037a1.5%201.5%200%200%201-2.12%202.12l-37-37a1.5%201.5%200%200%201%200-2.12%22%2F%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22SVGZTeAjepU1%22%20x1%3D%2219.19%22%20x2%3D%2223.289%22%20y1%3D%2224%22%20y2%3D%2242.935%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23e7dede%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23d3d3d3%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGvsICmjNc1%22%20x1%3D%2229.4%22%20x2%3D%2232.323%22%20y1%3D%2212.111%22%20y2%3D%2222.633%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23fdfdfd%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23e4e4e4%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGAFHJje0q1%22%20x1%3D%2242%22%20x2%3D%226%22%20y1%3D%226%22%20y2%3D%2242%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%22.471%22%20stop-opacity%3D%220%22%2F%3E%3Cstop%20offset%3D%22.485%22%2F%3E%3Cstop%20offset%3D%22.569%22%20stop-opacity%3D%22.021%22%2F%3E%3Cstop%20offset%3D%22.618%22%20stop-opacity%3D%220%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGelPK2dAr1%22%20x1%3D%224%22%20x2%3D%2236.5%22%20y1%3D%22-3.5%22%20y2%3D%2245.25%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23e82c41%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23aa1d2d%22%2F%3E%3C%2FlinearGradient%3E%3CradialGradient%20id%3D%22SVG8sJ7543E1%22%20cx%3D%220%22%20cy%3D%220%22%20r%3D%221%22%20gradientTransform%3D%22rotate(51.687%2010.639%20-15.53)scale(99.5459%2090.5437)%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%22.338%22%20stop-color%3D%22%23a9a9a9%22%2F%3E%3Cstop%20offset%3D%22.695%22%20stop-color%3D%22%23898989%22%2F%3E%3C%2FradialGradient%3E%3C%2Fdefs%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fluent-color/image-off-48.svg?color=%231a73e8&size=48
