Cover image for AwesomeCSS #1 | Apply Image Filters Just Using CSS

AwesomeCSS #1 | Apply Image Filters Just Using CSS

memahesh profile image Medam Mahesh ・1 min read

This was something awesome that I had stumbled upon last week.

I am not much of a social butterfly but I do know that there is always a lot of buzz about filters going on in the social media. Coincidentally, the technique of this also revolves around a CSS property called filter.

Incase you are interested in watching video :

Interesting Finds

CSS filter property

The filter property defines visual effects (like blur and saturation) to an element (often ).
~ W3 Schools Link

CSS mix-blend-mode property

The mix-blend-mode property specifies how an element's content should blend with its direct parent background.
~ W3 Schools Link

Checkout the Codepen :

Thanks for reading till the end,

[Please have a look at my YouTube Channel. I post interesting web-related videos on it : https://www.youtube.com/channel/UCvf5cqRQk6aOmFZrgoU6K-Q]

Posted on by:

memahesh profile

Medam Mahesh


Trying to make a career in Software Engineering. Also working on my video editing and content writing skills.


markdown guide

Hello Fellow Dev,

I am very much interested in hearing your thoughts and adventures with CSS. Take a minute to share them with me.