Get new jQuery plugins just once a week

×

Filter-me

November 24, 2012

Filter-me | jQuery plugin to filter images using canvas

filter-me is a jQuery plugin that allows you to apply filters to images using Photoshop .acv Curves Adjustment files. jDataView is used to read the Photoshop file, from which we create a Monotonic Spline Curve representing its data. From this curve the new pixel RGB values can be calculated. These values are then applied using HTML5’s canvas element.

Literally any Photoshop curves file can be applied to multiple images with ease. This is a great alternative to using something like PHP’s imagemagick to try and replicate similar filtering.
Example Usage

$('.filter').filterme({
desaturate: false // Value from 0 - 1. 1 equals full desaturation (black & white).
curves: false // Object of RGB values in production script, or string name of curves .acv file in development script.
vignette: false // 'true' or 'false'. Add a vignette to the image.
folder: 'acv/' // Development script only. Location of the .acv folder, relative to the current file.
debug: false // Set to 'true' for script debugging. Logs information along execution in console.
});

Created by Matthew Ruddy

Download

Example

jquery filter-me plugin

Filter your images via Photoshop curves.

Filter-me

Related posts:

Fabric-js
zLayer
wheelnav-js
jquery filter-me plugin

http://jquer.in/wp-content/uploads/2012/11/jquery-filter-me.png

jQuery plugin

Sign up for our weekly newsletter.

* We won't spam you ever