CSS 3: Filter's examples with CSS-Filters-Polyfill

dummy Images

CSS 3 Filter : Grayscale 

.filter-grayscale{
    -webkit-filter:grayscale(1);
    -moz-filter:grayscale(1);
    -ms-filter:grayscale(1);
    filter:grayscale(1);
}
dummy Images

CSS 3 Filter : Sepia 

.filter-sepia{
    -webkit-filter:sepia(1);
    -moz-filter:sepia(1);
    -ms-filter:sepia(1);
    filter:sepia(1);
}
dummy Images

CSS 3 Filter : Blur 

.filter-blur{
    -webkit-filter:blur(4px);
    -moz-filter:blur(4px);
    -ms-filter:blur(4px);
    filter:blur(4px);
}
dummy Images

CSS 3 Filter : Invert 

.filter-invert{
    -webkit-filter:invert(1);
    -moz-filter:invert(1);
    -ms-filter:invert(1);
    filter:invert(1);
}
dummy Images

CSS 3 Filter : Brightness 

.filter-brightness{
    -webkit-filter: brightness(50%);
    -moz-filter: brightness(50%);
    -ms-filter: brightness(50%);
    filter: brightness(50%);
}
dummy Images

CSS 3 Filter : Shadow 

.filter-shadow{
    -webkit-filter: drop-shadow(4px 4px 4px #000);
    -moz-filter: drop-shadow(4px 4px 4px #000);
    -ms-filter: drop-shadow(4px 4px 4px #000);
    filter: drop-shadow(4px 4px 4px #000);
}
dummy Images

CSS 3 Filter : Shadow - 02 

.filter-shadow-02{
    -webkit-filter: drop-shadow(0 0 4px #000);
    -moz-filter: drop-shadow(0 0 4px #000);
    -ms-filter: drop-shadow(0 0 4px #000);
    filter: drop-shadow(0 0 4px #000);
}
dummy Images

CSS 3 Filter : Saturate 

.filter-saturate{
    -webkit-filter: saturate(50%);
    -moz-filter: saturate(50%);
    -ms-filter: saturate(50%);
    filter: saturate(50%);
}
dummy Images

CSS 3 Filter : Hue-Rotate 

.filter-hue-rotate{
    -webkit-filter: hue-rotate(90deg);
    -moz-filter: hue-rotate(90deg);
    -ms-filter: hue-rotate(90deg);
    filter: hue-rotate(90deg);
}