The Lodge is members-only design/dev videos and Office Hours.

Next Office Hours Session: "Implementing an SVG Icon System" Nov 30 - 6:00 PM Eastern

How to create black and white to colorized images on hover?

  • # January 30, 2013 at 5:36 am


    I want to have some images that change from black and white to colorized version on hover and work cross browser (in ie too).

    How can I do that?


    # January 30, 2013 at 5:40 am


    I don’t think that can be some with a single CSS property right now with any depth of support.

    I think the greyscale filter property will work for webkit browsers (and perhaps FF) but other than that, I don’t think so.

    There are workarounds (image swapping etc) but that’s not what you are after, I assume?

    # January 30, 2013 at 6:04 am

    There you go:

    Compatible IE 6-10 and other browsers with CSS filters and SVG.

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.

There's a whole bunch of content on CSS-Tricks.

Search for Stuff   •   Browse the Archives

Get the Newsletter ... or get the RSS feed