css filter sepia contrast blur

Code works in Chrome and Safari only.

CSS:


<style>

.filter { -webkit-filter: sepia(70%) contrast(100%) blur(3px); }​

</style>

html:


<div class="well">

    <h3>sample image:</h3>

    <img src="https://via.placeholder.com/200x80">

</div>



<div class="well">

    <h3>filtered image:</h3>

    <img class="filter" src="https://via.placeholder.com/200x80">

    <div class="filter">filtered text</div>

</div>

Leave a Comment