Created

Embed URL

HTTPS clone URL

SSH clone URL

You can clone with HTTPS or SSH.

Download Gist

Combined filters demo

View dabblet.css
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28
/**
* 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;
}
View dabblet.css
1 2 3 4 5
<h1>Hover over the kittens to see how the original image looked like</h1>
<img src="http://placekitten.com/250/220" />
<img src="http://placekitten.com/250/220" />
<img src="http://placekitten.com/250/220" />
<img src="http://placekitten.com/250/220" />
View dabblet.css
1
{"view":"split-vertical","prefixfree":"1","page":"css"}
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.