Latest news
Home » CSS » Convert Images To Black And White using CSS-grayscale filter

Convert Images To Black And White using CSS-grayscale filter

The CSS grayscale filter

We can change color image to a black and white with CSS.
We need to implement a filter as a class.

img.blackndwhite{ filter: grayscale(100%); }

Chrome and Safari still implement CSS filters need web kit declaration.

img.blackndwhite { -webkit-filter: grayscale(100%); filter: grayscale(100%); }

—————————-More grayscale filter code examples——————–

img.blackndwhite {
filter: url("data:image/svg+xml;utf8,#grayscale"); /*** Firefox 3.5+ ****/
filter: gray; /*** IE6-9 ****/
-webkit-filter: grayscale(100%); /*** Chrome 19+ & Safari 6+ ****/
}

Leave a Reply

x

Check Also

How to delete your whatsapp status

WhatsApp is a famous messaging App on the internet. Now Facebook is managing Whatsapp. Whatsapp is ...