Built with Grunt

Photographic filters made with CSS, inspired by VSCO and CSSgram http://www.cssco.co


How to use CSSCO

Add the downloaded CSS file path to the <head> of your document:

<link rel="stylesheet" href="path/to/cssco.css">

Add the filter to your image element using the relevant CSSCO classes:

<div class="cssco cssco--c1">
   <img src="image.png">


Unfortunately, IE & Edge browsers, as well as Opera Mini do not support filters and blend modes.

Safari (desktop & iOS) does not support the hue, saturation, color, and luminosity blend modes, but this should not affect the CSSCO filters much, if at all.

See compatibility for: mixblendmode | filters

*These filters are inspired by VSCO and are not exact replicas of their filters, but are as close as I could get. If you think you can get closer, please feel free to contribute :)



Ensure that the following is installed on your computer:

  1. Git
  2. Node.js

Getting started

  1. Clone the repository: git clone git@github.com:we-are-next/cssco.git
  2. Change to the directory you cloned the repository into: e.g. cd cssco


  1. Install the required dependencies: npm install
  2. Lint: grunt lint
  3. Minify: grunt min

Made by Jason, Chris and Shawn

© 2020 Builtneat, Inc. All rights reserved.