CSSGram: Bringing Instagram-like photo filters to the web

CSSGram ScreenshotDespite currently being a Photography minor, where I am assured that I should only like pure photography without any filters, I do love my Instagram filters. I’ve secretly wished there was a way to bring those filters with me to the desktop or the web. Well, it’s here. Now.

CSSGram brings Instagram-like filters to the web, applying those filters to photos using only CSS! It’s a testament, really, to the power of CSS.

Funny Doggy Big Yawn Funny Doggy Big Yawn Funny Doggy Big Yawn Funny Doggy Big Yawn

There are four images above, all the same unmodified image. The effects are rendered purely with CSS. The first is without a filter, the second is using the ‘Toaster’ filter. The third is using the ‘X-Pro II’ filter, and the last image is with the black and white ‘Inkwell’ filter.

The best part of CSSGram is that it’s easy to implement! Just download the CSS file provided on the site, link it in your HTML, and to apply the filter, just assign the corresponding class to your image. It’s that easy!

Grab the CSS and instructions on how to use these filters on your own site at CSSGram.

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.