Austin, Texas-based front end developer Una Kravets has created CSSgram, a tiny library that recreates the look of Instagram filters using CSS filters and blend modes.
“Simply put, CSSgram is a library for editing your images with Instagram-like filters directly in CSS,” Kravets writes. “What we’re doing here is adding filters to the images as well as applying color and/or gradient overlays via various blending techniques to mimic these effects.”
“This means less manual image processing and more fun filter effects on the web!” Kravets has recreated 17 Instagram filters:
The website has a field for inputting a link to your own photo to instantly see what it looks like with each filter. We tried it out with this shot:
Here are a few of the results that appeared:
You can also include or download the library (it weighs less than 1 kilobyte) for you own project to quickly add filters to your web images by adding a class to the figure element. Head on over to CSSgram to try it out for yourself.
Thanks for sending in the tip, Photoreview!