Черно-белое изображение

Как преобразовать любое цветное изображение в черно-белое при помощи CSS.

Оригинальное изображение

Градации серого (100%)

Для преобразования цветного изображения в черно-белое (все оттенки серого) используем CSS свойство filter.

Изменяем цвет всех изображений на черно-белый (все оттенки серого):


img {
  -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
  filter: grayscale(100%);
}