JSFiddle - React, Tailwind, and code Playground

by cssGuy

HTML

<img src="http://www.placecage.com/100/100" alt="" id="a">
<img src="http://www.placecage.com/100/100" alt="" id="b">
<img src="http://www.placecage.com/100/100" alt="" id="c">
<img src="http://www.placecage.com/100/100" alt="" id="d">
<img src="http://www.placecage.com/100/100" alt="" id="e">
<img src="http://www.placecage.com/100/100" alt="" id="f">
<img src="http://www.placecage.com/100/100" alt="" id="g">
<img src="http://www.placecage.com/100/100" alt="" id="h">
<img src="http://www.placecage.com/100/100" alt="" id="i">
<img src="http://www.placecage.com/100/100" alt="" id="j">

CSS

#a {
    -webkit-filter: blur(5px);
}
#b {
    -webkit-filter: grayscale(1);
}
#c {
    -webkit-filter: saturate(5)
}
#d {
    -webkit-filter: sepia(1)
}
#e {
    -webkit-filter: invert(1);
}
#f {
    -webkit-filter: opacity(50%);
}
#g {
    -webkit-filter: contrast(10%);
}
#h {
    -webkit-filter: brightness(559%);
}
#i {
    -webkit-filter: drop-shadow(1.03px 1.86px 8.54px rgba(253, 0, 123, 0.8));
}
#j {
    -webkit-filter: hue-rotate(206deg);
}