screen attention off icon
screen-attention-off from Material Symbols by Google · Regular · Apache-2.0 Free for personal and commercial use.
- Name
- screen-attention-off
- Set
- Material Symbols
- Style
- Regular
- Viewbox
- 24×24
- License
- Apache 2.0
Related icons in Material Symbols
Use the screen attention off icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M21.2 21.2L13 13v1l1.825 3.65q.075.175.125.35t.05.375q0 .675-.475 1.15q-.475.475-1.15.475H9v-2h4l-1.8-3.575q-.125-.2-.162-.437Q11 13.75 11 13.525V11L6 6q-.725 0-1.375.262q-.65.263-1.2.738L2 5.6q.5-.45 1.075-.788q.575-.337 1.2-.537L2.8 2.8l1.425-1.425l18.4 18.4ZM6.5 14q-1.05 0-1.775-.725Q4 12.55 4 11.5q0-1.05.725-1.775Q5.45 9 6.5 9q1.05 0 1.775.725Q9 10.45 9 11.5q0 1.05-.725 1.775Q7.55 14 6.5 14Zm12.6-.6l-3.5-3.5q.35-.425.838-.662Q16.925 9 17.5 9q1.05 0 1.775.725Q20 10.45 20 11.5q0 .575-.237 1.062q-.238.488-.663.838ZM15.425 7L14 5.6q.825-.75 1.85-1.175Q16.875 4 18 4t2.15.425Q21.175 4.85 22 5.6L20.575 7q-.55-.475-1.2-.738Q18.725 6 18 6t-1.375.262q-.65.263-1.2.738Z"/></svg>
React
import type { SVGProps } from "react";
export function MaterialSymbolsScreenAttentionOff(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M21.2 21.2L13 13v1l1.825 3.65q.075.175.125.35t.05.375q0 .675-.475 1.15q-.475.475-1.15.475H9v-2h4l-1.8-3.575q-.125-.2-.162-.437Q11 13.75 11 13.525V11L6 6q-.725 0-1.375.262q-.65.263-1.2.738L2 5.6q.5-.45 1.075-.788q.575-.337 1.2-.537L2.8 2.8l1.425-1.425l18.4 18.4ZM6.5 14q-1.05 0-1.775-.725Q4 12.55 4 11.5q0-1.05.725-1.775Q5.45 9 6.5 9q1.05 0 1.775.725Q9 10.45 9 11.5q0 1.05-.725 1.775Q7.55 14 6.5 14Zm12.6-.6l-3.5-3.5q.35-.425.838-.662Q16.925 9 17.5 9q1.05 0 1.775.725Q20 10.45 20 11.5q0 .575-.237 1.062q-.238.488-.663.838ZM15.425 7L14 5.6q.825-.75 1.85-1.175Q16.875 4 18 4t2.15.425Q21.175 4.85 22 5.6L20.575 7q-.55-.475-1.2-.738Q18.725 6 18 6t-1.375.262q-.65.263-1.2.738Z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M21.2 21.2L13 13v1l1.825 3.65q.075.175.125.35t.05.375q0 .675-.475 1.15q-.475.475-1.15.475H9v-2h4l-1.8-3.575q-.125-.2-.162-.437Q11 13.75 11 13.525V11L6 6q-.725 0-1.375.262q-.65.263-1.2.738L2 5.6q.5-.45 1.075-.788q.575-.337 1.2-.537L2.8 2.8l1.425-1.425l18.4 18.4ZM6.5 14q-1.05 0-1.775-.725Q4 12.55 4 11.5q0-1.05.725-1.775Q5.45 9 6.5 9q1.05 0 1.775.725Q9 10.45 9 11.5q0 1.05-.725 1.775Q7.55 14 6.5 14Zm12.6-.6l-3.5-3.5q.35-.425.838-.662Q16.925 9 17.5 9q1.05 0 1.775.725Q20 10.45 20 11.5q0 .575-.237 1.062q-.238.488-.663.838ZM15.425 7L14 5.6q.825-.75 1.85-1.175Q16.875 4 18 4t2.15.425Q21.175 4.85 22 5.6L20.575 7q-.55-.475-1.2-.738Q18.725 6 18 6t-1.375.262q-.65.263-1.2.738Z"/></svg> </template>
CSS
.icon-screen-attention-off {
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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M21.2%2021.2L13%2013v1l1.825%203.65q.075.175.125.35t.05.375q0%20.675-.475%201.15q-.475.475-1.15.475H9v-2h4l-1.8-3.575q-.125-.2-.162-.437Q11%2013.75%2011%2013.525V11L6%206q-.725%200-1.375.262q-.65.263-1.2.738L2%205.6q.5-.45%201.075-.788q.575-.337%201.2-.537L2.8%202.8l1.425-1.425l18.4%2018.4ZM6.5%2014q-1.05%200-1.775-.725Q4%2012.55%204%2011.5q0-1.05.725-1.775Q5.45%209%206.5%209q1.05%200%201.775.725Q9%2010.45%209%2011.5q0%201.05-.725%201.775Q7.55%2014%206.5%2014Zm12.6-.6l-3.5-3.5q.35-.425.838-.662Q16.925%209%2017.5%209q1.05%200%201.775.725Q20%2010.45%2020%2011.5q0%20.575-.237%201.062q-.238.488-.663.838ZM15.425%207L14%205.6q.825-.75%201.85-1.175Q16.875%204%2018%204t2.15.425Q21.175%204.85%2022%205.6L20.575%207q-.55-.475-1.2-.738Q18.725%206%2018%206t-1.375.262q-.65.263-1.2.738Z%22%2F%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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M21.2%2021.2L13%2013v1l1.825%203.65q.075.175.125.35t.05.375q0%20.675-.475%201.15q-.475.475-1.15.475H9v-2h4l-1.8-3.575q-.125-.2-.162-.437Q11%2013.75%2011%2013.525V11L6%206q-.725%200-1.375.262q-.65.263-1.2.738L2%205.6q.5-.45%201.075-.788q.575-.337%201.2-.537L2.8%202.8l1.425-1.425l18.4%2018.4ZM6.5%2014q-1.05%200-1.775-.725Q4%2012.55%204%2011.5q0-1.05.725-1.775Q5.45%209%206.5%209q1.05%200%201.775.725Q9%2010.45%209%2011.5q0%201.05-.725%201.775Q7.55%2014%206.5%2014Zm12.6-.6l-3.5-3.5q.35-.425.838-.662Q16.925%209%2017.5%209q1.05%200%201.775.725Q20%2010.45%2020%2011.5q0%20.575-.237%201.062q-.238.488-.663.838ZM15.425%207L14%205.6q.825-.75%201.85-1.175Q16.875%204%2018%204t2.15.425Q21.175%204.85%2022%205.6L20.575%207q-.55-.475-1.2-.738Q18.725%206%2018%206t-1.375.262q-.65.263-1.2.738Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/material-symbols/screen-attention-off.svg?color=%231a73e8&size=48