Skip to content
It is a little javascript library for you to add some effects on photos using HTML5 canvas
Branch: master
Clone or download

README.md

CanvasEffects

It is a little javascript library for you to add some effects on photos using HTML5 canvas

Features

What's new

  1. Add new effects (White Balance adjust).
  2. Add new examples: A colour chart and (3x3 custom convolution matrix).
  3. Added fx.colorTempToRGB(temp) to convert colour temperstures to RGB values.

How to use

var canvas = document.getElementById('fx'); //the canvas object
var opts = {
	useWorker:true, //Whether to use Web Worker to do the processing or not
	workerPath:'./CanvasEffects.worker.min.js', //The path to the worker
	width: 100, //Override the width of the original canvas
	height: 100 //Override the height of the original canvas
}
var fx = new CanvasEffects(canvas,opts); //Initlize the CanvasEffect instance

//load the image
fx.load('pict.jpg', function(){
	//call the effect methods
	//for example,
	this.greyscale();
	this.blur(10);
	this.sepia();
	this.glow(5);
});

//effect methods can be chained
fx.sepia().gamma(1.1).blur(30).glow(5);

Development

This is an active project. If you have any suggestions or having bugs please make it as an issue.

You can’t perform that action at this time.