ios color filter icon
ios-color-filter-outline from IonIcons by Ben Sperry · Outline · MIT Free for personal and commercial use.
- Name
- ios-color-filter-outline
- Set
- IonIcons
- Style
- Outline
- Viewbox
- 512×512
- License
- MIT
1 other variant in IonIcons
Related icons in IonIcons
ios-addios-add-circleios-airplaneios-alarmios-albumsios-alertios-american-footballios-americanfootballios-analyticsios-apertureios-appsios-appstoreios-archiveios-arrow-backios-arrow-downios-arrow-dropdownios-arrow-dropdown-circleios-arrow-dropleftios-arrow-dropleft-circleios-arrow-droprightios-arrow-dropright-circleios-arrow-dropupios-arrow-dropup-circleios-arrow-forward
Use the ios color filter icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path d="M366.195 212.122A112.581 112.581 0 0 0 368.001 192c0-61.856-50.145-112.001-112.001-112.001S143.999 130.144 143.999 192c0 6.87.621 13.594 1.806 20.122C98.616 225.302 63.999 268.606 63.999 320c0 61.856 50.145 112.001 112.001 112.001 31.342 0 59.671-12.879 80-33.627 20.329 20.748 48.658 33.627 80 33.627 61.856 0 112.001-50.145 112.001-112.001 0-51.394-34.617-94.697-81.806-107.878zM159.999 192c0-52.935 43.065-96.001 96.001-96.001s96.001 43.066 96.001 96.001c0 5.776-.513 11.435-1.495 16.933-4.749-.614-9.59-.934-14.506-.934-31.342 0-59.671 12.879-80 33.627-20.329-20.748-48.658-33.627-80-33.627-4.916 0-9.757.319-14.506.934A96.248 96.248 0 0 1 159.999 192zm112.002 128c0 19.58-5.896 37.806-16.001 53.006-10.104-15.2-16.001-33.426-16.001-53.006 0-5.776.513-11.435 1.495-16.933a113.082 113.082 0 0 0 29.012 0A96.248 96.248 0 0 1 272.001 320zM256 288.001a96.29 96.29 0 0 1-10.314-.556A95.787 95.787 0 0 1 256 266.994a95.74 95.74 0 0 1 10.314 20.451 96.29 96.29 0 0 1-10.314.556zm-26.209-3.637c-29.756-8.455-53.666-30.937-64.105-59.81 3.39-.364 6.83-.556 10.314-.556 27.353 0 52.069 11.5 69.572 29.917a111.686 111.686 0 0 0-15.781 30.449zm36.637-30.447c17.503-18.418 42.219-29.918 69.572-29.918 3.484 0 6.925.191 10.314.556-10.439 28.873-34.35 51.354-64.105 59.81a111.637 111.637 0 0 0-15.781-30.448zM176 416.001c-52.936 0-96.001-43.065-96.001-96.001 0-43.852 29.555-80.931 69.792-92.364 11.732 34.983 40.265 62.257 76.014 72.243A112.57 112.57 0 0 0 223.999 320c0 24.717 8.013 47.559 21.573 66.084-17.503 18.417-42.219 29.917-69.572 29.917zm160 0c-27.354 0-52.069-11.5-69.572-29.918 13.561-18.524 21.573-41.366 21.573-66.083 0-6.869-.621-13.594-1.806-20.121 35.749-9.986 64.281-37.26 76.014-72.243 40.237 11.434 69.792 48.513 69.792 92.364 0 52.936-43.065 96.001-96.001 96.001z" fill="currentColor"/></svg>
React
import type { SVGProps } from "react";
export function IonIosColorFilterOutline(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path d="M366.195 212.122A112.581 112.581 0 0 0 368.001 192c0-61.856-50.145-112.001-112.001-112.001S143.999 130.144 143.999 192c0 6.87.621 13.594 1.806 20.122C98.616 225.302 63.999 268.606 63.999 320c0 61.856 50.145 112.001 112.001 112.001 31.342 0 59.671-12.879 80-33.627 20.329 20.748 48.658 33.627 80 33.627 61.856 0 112.001-50.145 112.001-112.001 0-51.394-34.617-94.697-81.806-107.878zM159.999 192c0-52.935 43.065-96.001 96.001-96.001s96.001 43.066 96.001 96.001c0 5.776-.513 11.435-1.495 16.933-4.749-.614-9.59-.934-14.506-.934-31.342 0-59.671 12.879-80 33.627-20.329-20.748-48.658-33.627-80-33.627-4.916 0-9.757.319-14.506.934A96.248 96.248 0 0 1 159.999 192zm112.002 128c0 19.58-5.896 37.806-16.001 53.006-10.104-15.2-16.001-33.426-16.001-53.006 0-5.776.513-11.435 1.495-16.933a113.082 113.082 0 0 0 29.012 0A96.248 96.248 0 0 1 272.001 320zM256 288.001a96.29 96.29 0 0 1-10.314-.556A95.787 95.787 0 0 1 256 266.994a95.74 95.74 0 0 1 10.314 20.451 96.29 96.29 0 0 1-10.314.556zm-26.209-3.637c-29.756-8.455-53.666-30.937-64.105-59.81 3.39-.364 6.83-.556 10.314-.556 27.353 0 52.069 11.5 69.572 29.917a111.686 111.686 0 0 0-15.781 30.449zm36.637-30.447c17.503-18.418 42.219-29.918 69.572-29.918 3.484 0 6.925.191 10.314.556-10.439 28.873-34.35 51.354-64.105 59.81a111.637 111.637 0 0 0-15.781-30.448zM176 416.001c-52.936 0-96.001-43.065-96.001-96.001 0-43.852 29.555-80.931 69.792-92.364 11.732 34.983 40.265 62.257 76.014 72.243A112.57 112.57 0 0 0 223.999 320c0 24.717 8.013 47.559 21.573 66.084-17.503 18.417-42.219 29.917-69.572 29.917zm160 0c-27.354 0-52.069-11.5-69.572-29.918 13.561-18.524 21.573-41.366 21.573-66.083 0-6.869-.621-13.594-1.806-20.121 35.749-9.986 64.281-37.26 76.014-72.243 40.237 11.434 69.792 48.513 69.792 92.364 0 52.936-43.065 96.001-96.001 96.001z" fill="currentColor"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path d="M366.195 212.122A112.581 112.581 0 0 0 368.001 192c0-61.856-50.145-112.001-112.001-112.001S143.999 130.144 143.999 192c0 6.87.621 13.594 1.806 20.122C98.616 225.302 63.999 268.606 63.999 320c0 61.856 50.145 112.001 112.001 112.001 31.342 0 59.671-12.879 80-33.627 20.329 20.748 48.658 33.627 80 33.627 61.856 0 112.001-50.145 112.001-112.001 0-51.394-34.617-94.697-81.806-107.878zM159.999 192c0-52.935 43.065-96.001 96.001-96.001s96.001 43.066 96.001 96.001c0 5.776-.513 11.435-1.495 16.933-4.749-.614-9.59-.934-14.506-.934-31.342 0-59.671 12.879-80 33.627-20.329-20.748-48.658-33.627-80-33.627-4.916 0-9.757.319-14.506.934A96.248 96.248 0 0 1 159.999 192zm112.002 128c0 19.58-5.896 37.806-16.001 53.006-10.104-15.2-16.001-33.426-16.001-53.006 0-5.776.513-11.435 1.495-16.933a113.082 113.082 0 0 0 29.012 0A96.248 96.248 0 0 1 272.001 320zM256 288.001a96.29 96.29 0 0 1-10.314-.556A95.787 95.787 0 0 1 256 266.994a95.74 95.74 0 0 1 10.314 20.451 96.29 96.29 0 0 1-10.314.556zm-26.209-3.637c-29.756-8.455-53.666-30.937-64.105-59.81 3.39-.364 6.83-.556 10.314-.556 27.353 0 52.069 11.5 69.572 29.917a111.686 111.686 0 0 0-15.781 30.449zm36.637-30.447c17.503-18.418 42.219-29.918 69.572-29.918 3.484 0 6.925.191 10.314.556-10.439 28.873-34.35 51.354-64.105 59.81a111.637 111.637 0 0 0-15.781-30.448zM176 416.001c-52.936 0-96.001-43.065-96.001-96.001 0-43.852 29.555-80.931 69.792-92.364 11.732 34.983 40.265 62.257 76.014 72.243A112.57 112.57 0 0 0 223.999 320c0 24.717 8.013 47.559 21.573 66.084-17.503 18.417-42.219 29.917-69.572 29.917zm160 0c-27.354 0-52.069-11.5-69.572-29.918 13.561-18.524 21.573-41.366 21.573-66.083 0-6.869-.621-13.594-1.806-20.121 35.749-9.986 64.281-37.26 76.014-72.243 40.237 11.434 69.792 48.513 69.792 92.364 0 52.936-43.065 96.001-96.001 96.001z" fill="currentColor"/></svg> </template>
CSS
.icon-ios-color-filter-outline {
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%20512%20512%22%3E%3Cpath%20d%3D%22M366.195%20212.122A112.581%20112.581%200%200%200%20368.001%20192c0-61.856-50.145-112.001-112.001-112.001S143.999%20130.144%20143.999%20192c0%206.87.621%2013.594%201.806%2020.122C98.616%20225.302%2063.999%20268.606%2063.999%20320c0%2061.856%2050.145%20112.001%20112.001%20112.001%2031.342%200%2059.671-12.879%2080-33.627%2020.329%2020.748%2048.658%2033.627%2080%2033.627%2061.856%200%20112.001-50.145%20112.001-112.001%200-51.394-34.617-94.697-81.806-107.878zM159.999%20192c0-52.935%2043.065-96.001%2096.001-96.001s96.001%2043.066%2096.001%2096.001c0%205.776-.513%2011.435-1.495%2016.933-4.749-.614-9.59-.934-14.506-.934-31.342%200-59.671%2012.879-80%2033.627-20.329-20.748-48.658-33.627-80-33.627-4.916%200-9.757.319-14.506.934A96.248%2096.248%200%200%201%20159.999%20192zm112.002%20128c0%2019.58-5.896%2037.806-16.001%2053.006-10.104-15.2-16.001-33.426-16.001-53.006%200-5.776.513-11.435%201.495-16.933a113.082%20113.082%200%200%200%2029.012%200A96.248%2096.248%200%200%201%20272.001%20320zM256%20288.001a96.29%2096.29%200%200%201-10.314-.556A95.787%2095.787%200%200%201%20256%20266.994a95.74%2095.74%200%200%201%2010.314%2020.451%2096.29%2096.29%200%200%201-10.314.556zm-26.209-3.637c-29.756-8.455-53.666-30.937-64.105-59.81%203.39-.364%206.83-.556%2010.314-.556%2027.353%200%2052.069%2011.5%2069.572%2029.917a111.686%20111.686%200%200%200-15.781%2030.449zm36.637-30.447c17.503-18.418%2042.219-29.918%2069.572-29.918%203.484%200%206.925.191%2010.314.556-10.439%2028.873-34.35%2051.354-64.105%2059.81a111.637%20111.637%200%200%200-15.781-30.448zM176%20416.001c-52.936%200-96.001-43.065-96.001-96.001%200-43.852%2029.555-80.931%2069.792-92.364%2011.732%2034.983%2040.265%2062.257%2076.014%2072.243A112.57%20112.57%200%200%200%20223.999%20320c0%2024.717%208.013%2047.559%2021.573%2066.084-17.503%2018.417-42.219%2029.917-69.572%2029.917zm160%200c-27.354%200-52.069-11.5-69.572-29.918%2013.561-18.524%2021.573-41.366%2021.573-66.083%200-6.869-.621-13.594-1.806-20.121%2035.749-9.986%2064.281-37.26%2076.014-72.243%2040.237%2011.434%2069.792%2048.513%2069.792%2092.364%200%2052.936-43.065%2096.001-96.001%2096.001z%22%20fill%3D%22currentColor%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%20512%20512%22%3E%3Cpath%20d%3D%22M366.195%20212.122A112.581%20112.581%200%200%200%20368.001%20192c0-61.856-50.145-112.001-112.001-112.001S143.999%20130.144%20143.999%20192c0%206.87.621%2013.594%201.806%2020.122C98.616%20225.302%2063.999%20268.606%2063.999%20320c0%2061.856%2050.145%20112.001%20112.001%20112.001%2031.342%200%2059.671-12.879%2080-33.627%2020.329%2020.748%2048.658%2033.627%2080%2033.627%2061.856%200%20112.001-50.145%20112.001-112.001%200-51.394-34.617-94.697-81.806-107.878zM159.999%20192c0-52.935%2043.065-96.001%2096.001-96.001s96.001%2043.066%2096.001%2096.001c0%205.776-.513%2011.435-1.495%2016.933-4.749-.614-9.59-.934-14.506-.934-31.342%200-59.671%2012.879-80%2033.627-20.329-20.748-48.658-33.627-80-33.627-4.916%200-9.757.319-14.506.934A96.248%2096.248%200%200%201%20159.999%20192zm112.002%20128c0%2019.58-5.896%2037.806-16.001%2053.006-10.104-15.2-16.001-33.426-16.001-53.006%200-5.776.513-11.435%201.495-16.933a113.082%20113.082%200%200%200%2029.012%200A96.248%2096.248%200%200%201%20272.001%20320zM256%20288.001a96.29%2096.29%200%200%201-10.314-.556A95.787%2095.787%200%200%201%20256%20266.994a95.74%2095.74%200%200%201%2010.314%2020.451%2096.29%2096.29%200%200%201-10.314.556zm-26.209-3.637c-29.756-8.455-53.666-30.937-64.105-59.81%203.39-.364%206.83-.556%2010.314-.556%2027.353%200%2052.069%2011.5%2069.572%2029.917a111.686%20111.686%200%200%200-15.781%2030.449zm36.637-30.447c17.503-18.418%2042.219-29.918%2069.572-29.918%203.484%200%206.925.191%2010.314.556-10.439%2028.873-34.35%2051.354-64.105%2059.81a111.637%20111.637%200%200%200-15.781-30.448zM176%20416.001c-52.936%200-96.001-43.065-96.001-96.001%200-43.852%2029.555-80.931%2069.792-92.364%2011.732%2034.983%2040.265%2062.257%2076.014%2072.243A112.57%20112.57%200%200%200%20223.999%20320c0%2024.717%208.013%2047.559%2021.573%2066.084-17.503%2018.417-42.219%2029.917-69.572%2029.917zm160%200c-27.354%200-52.069-11.5-69.572-29.918%2013.561-18.524%2021.573-41.366%2021.573-66.083%200-6.869-.621-13.594-1.806-20.121%2035.749-9.986%2064.281-37.26%2076.014-72.243%2040.237%2011.434%2069.792%2048.513%2069.792%2092.364%200%2052.936-43.065%2096.001-96.001%2096.001z%22%20fill%3D%22currentColor%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ion/ios-color-filter-outline.svg?color=%231a73e8&size=48
