本文介绍了CSS过滤器作为一张图像的颜色修改器的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

是否可以通过CSS滤镜方法(例如HueRotate,饱和度和亮度)更改将PNG绘制为完全白色的颜色?类似于Photoshop的颜色叠加效果,但使用CSS.

Is it possible to change, with the CSS Filter methods like HueRotate, Saturation, and Brightness, the color of a PNG drawn totally white? Like Photoshop's color overlay effect, but in CSS.

这将是避免创建仅更改颜色的大量图像的好方法.例如,一组具有深色和浅色UI的图标.

This would be a good solution to avoid creating lots of images that change only color. For example, a set of icons that have dark and light versions for a UI.

推荐答案

您还可以通过添加棕褐色,然后添加一些饱和度,色相旋转度(例如色度)来给白色图像着色.在CSS中:

You can also colorize white images by adding sepia and then some saturation, hue-rotation, e.g. in CSS:

filter: sepia() saturate(10000%) hue-rotate(30deg)

这应该使白色图像变为绿色图像.

This should make white image as green image.

http://jsbin.com/xetefa/1/edit

这篇关于CSS过滤器作为一张图像的颜色修改器的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

06-21 04:39