CSSCO: Free VSCO-style Photo Filters Made with CSS

CSSCO is a new free and open source project that offers VSCO-style retro photo filters made and used entirely with CSS.

This means that web designers can now upload an ordinary photo and then have it display with a non-destructive filter when viewed on a webpage, simply by adding the CSSCO css classes to the HTML.

The project is the brainchild of developer Lauren Waller of next in South Africa. Waller says she created CSSCO over the span of a few weeks, and that the filters were inspired by VSCO and CSSGRAM, which recreated Instagram filters with CSS.

“Instead of having to use external photo editing tools like Photoshop or VSCO, you can grade your photographs in the browser,” Waller writes. “I have created simulations of some of the more popular VSCO filters, including: C1, F2, G3, P5, HB1, HB2, ACG, LV3, M5, A6, M3, T1, B5 and X1.”

Here’s a sample #nofilter photo followed by what a number of the CSSCO filters look like on it:

At the present time, Internet Explorer, Edge, and Opera Mini do not support these filters, so people who use those browsers will simply see your original, unfiltered image.

The CSS styles aren’t 100% replicas of the VSCO presets, but Waller is planning to improve them over time, as well as add additional filters to the collection. Since the project is open source, you can contribute to it over on GitHub.

To download the CSS file and for instructions on how it’s used, head on over to the CSSCO project website.