Есть png-иконки, например, из вк, синего цвета. Как с помощью css изменить его на белый?
P.S: нагуглил про filter: hue-rotate(), но с белым цветом это походу не вариант.
Ответ
Вы можете использовать css-фильтры:
grayscale конвертирует цвета в ч/б
sepia создает эффект сепии
saturate задает насыщенность
hue-rotate меняет цвета изображения в зависимости от заданного угла. Угол поворота определяет на сколько изменится данный цвет в цветовом круге от красного до фиолетового. Значение задается в градусах (0deg — 360deg)
invert инвертирует цвета
opacity задает прозрачность элемента
brightness изменяет яркость изображения
contrast изменяет контрастность изображения
blur создает эффект размытости
drop-shadow создает тень
Примечание: фильтры можно комбинировать между собой
.bg{
background-color: #8fbd35;
padding: 20px;
}
.fl{
filter: invert(1);
}
Материал для прочтения: habrahabr
Демо: демо
Комментариев нет:
Отправить комментарий