grayscale()

Базовая поддержка Широко распространена

Эта функция хорошо зарекомендовала себя и работает на многих устройствах и версиях браузеров. Она доступна во всех браузерах с сентября 2016 года.

Функция grayscale() CSS преобразует входное изображение в оттенки серого. Результатом является <filter-function>.

grayscale(amount)

amount: Значение, определяющее степень преобразования входного изображения в оттенки серого. Оно задаётся как <number> или <percentage>. Значение 100% полностью преобразует изображение в оттенки серого, а значение 0% оставляет изображение без изменений. Значения между 0% и 100% имеют линейные множители, влияющие на эффект. Если фильтр grayscale() присутствует без параметра, значение по умолчанию равно 1. Начальное значение, используемое для интерполяции, равно 0.

grayscale(0)     /* No effect */
grayscale(.7)    /* 70% grayscale */
grayscale(100%)  /* Completely grayscale */

Спецификация
Модуль фильтров визуальных эффектов уровень 1 # funcdef-filter-grayscale

	Рабочие столы					Мобильные устройства
	Chrome	Edge	Firefox	Opera	Safari	Chrome Android	Firefox for Android	Opera Android	Safari на iOS	Samsung Internet	WebView Android
`grayscale`	18	12	35	15	6	53	35	14	6	6.0	4.4

Другие функции <filter-function>, доступные для использования в значениях свойств filter и backdrop-filter:

© 2005–2024 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/CSS/filter-function/grayscale