Skip to content
Create a gist now

Instantly share code, notes, and snippets.

Combined filters demo
* Combined filters demo
* Webkit-only at the moment (Chrome Canary or Webkit nightlies)
img {
transition: .5s -webkit-filter;
img:first-of-type {
-webkit-filter: contrast(2000%) grayscale();
img:nth-of-type(2) {
-webkit-filter: grayscale() contrast(2000%);
img:nth-of-type(3) {
-webkit-filter: sepia() hue-rotate(60deg);
img:nth-of-type(4) {
-webkit-filter: sepia() saturate(200%) hue-rotate(160deg);
img:hover {
-webkit-filter: none;
<h1>Hover over the kittens to see how the original image looked like</h1>
<img src="" />
<img src="" />
<img src="" />
<img src="" />
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.