Making color images black and white with CSS3 is our discussion this time.
In the past we had to use Photoshop to give a photo grayscale (black and white) effect to an image, but now with the sophistication of css3 features we don’t need to be tired of editing it in Photoshop, just with a few lines of css code we can make color photos black and white.
Image by : comzeraddt
A few months ago tutorial-webdesign.com also discussed in the article Creating Instagram Effects with CSS3 filters, but until now it doesn’t support Firefox, but this time we will try to make a grayscale effect that can be run in Firefox.
Okay, let’s just practice making.
Prepare a file with the name grayscale.html with the following structure
For the css code like this