invert colors off icon
invert-colors-off from Material Symbols Light by Google · Regular · Images · Apache-2.0 Free for personal and commercial use.
- Name
- invert-colors-off
- Set
- Material Symbols Light
- Style
- Regular
- Category
- Images
- Viewbox
- 24×24
- License
- Apache 2.0
- Aliases
- invert-colors-off-outline, invert-colors-off-outline-sharp, invert-colors-off-sharp
1 other variant in Material Symbols Light
The same icon in other sets
More images icons from Material Symbols Light
Use the invert colors off icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M18.525 15.68L12 9.157V4.78L9.775 6.975l-.708-.708L12 3.384l4.958 4.864q1.046 1.027 1.544 2.29q.498 1.262.498 2.6q0 .662-.133 1.352q-.133.689-.342 1.19m1.275 5.536l-3.062-3.062q-1.03.986-2.268 1.416T12 20q-2.921 0-4.96-1.97T5 13.138q0-1.236.439-2.45t1.507-2.326l-3.469-3.47l.708-.707l16.323 16.323zM12 19v-5.579L7.654 9.075q-.948.992-1.301 1.997T6 13.139q0 2.5 1.75 4.18T12 19"/></svg>
React
import type { SVGProps } from "react";
export function MaterialSymbolsLightInvertColorsOff(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="M18.525 15.68L12 9.157V4.78L9.775 6.975l-.708-.708L12 3.384l4.958 4.864q1.046 1.027 1.544 2.29q.498 1.262.498 2.6q0 .662-.133 1.352q-.133.689-.342 1.19m1.275 5.536l-3.062-3.062q-1.03.986-2.268 1.416T12 20q-2.921 0-4.96-1.97T5 13.138q0-1.236.439-2.45t1.507-2.326l-3.469-3.47l.708-.707l16.323 16.323zM12 19v-5.579L7.654 9.075q-.948.992-1.301 1.997T6 13.139q0 2.5 1.75 4.18T12 19"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M18.525 15.68L12 9.157V4.78L9.775 6.975l-.708-.708L12 3.384l4.958 4.864q1.046 1.027 1.544 2.29q.498 1.262.498 2.6q0 .662-.133 1.352q-.133.689-.342 1.19m1.275 5.536l-3.062-3.062q-1.03.986-2.268 1.416T12 20q-2.921 0-4.96-1.97T5 13.138q0-1.236.439-2.45t1.507-2.326l-3.469-3.47l.708-.707l16.323 16.323zM12 19v-5.579L7.654 9.075q-.948.992-1.301 1.997T6 13.139q0 2.5 1.75 4.18T12 19"/></svg> </template>
CSS
.icon-invert-colors-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%22M18.525%2015.68L12%209.157V4.78L9.775%206.975l-.708-.708L12%203.384l4.958%204.864q1.046%201.027%201.544%202.29q.498%201.262.498%202.6q0%20.662-.133%201.352q-.133.689-.342%201.19m1.275%205.536l-3.062-3.062q-1.03.986-2.268%201.416T12%2020q-2.921%200-4.96-1.97T5%2013.138q0-1.236.439-2.45t1.507-2.326l-3.469-3.47l.708-.707l16.323%2016.323zM12%2019v-5.579L7.654%209.075q-.948.992-1.301%201.997T6%2013.139q0%202.5%201.75%204.18T12%2019%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%22M18.525%2015.68L12%209.157V4.78L9.775%206.975l-.708-.708L12%203.384l4.958%204.864q1.046%201.027%201.544%202.29q.498%201.262.498%202.6q0%20.662-.133%201.352q-.133.689-.342%201.19m1.275%205.536l-3.062-3.062q-1.03.986-2.268%201.416T12%2020q-2.921%200-4.96-1.97T5%2013.138q0-1.236.439-2.45t1.507-2.326l-3.469-3.47l.708-.707l16.323%2016.323zM12%2019v-5.579L7.654%209.075q-.948.992-1.301%201.997T6%2013.139q0%202.5%201.75%204.18T12%2019%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/material-symbols-light/invert-colors-off.svg?color=%231a73e8&size=48
