blend.js

The HTML5 canvas manipulation tool.

blend.js on github

1. The grid

Choose an image and create a grid to partition it. You can specify as many columns and rows as you want. Just make sure that each area gets at least a few pixels.

2. The FX

Create your blending effects. A blending effects is a custom function that receives custom parameters + an HTML5 context or some pixels data.

3. The blending

Apply your blending effects to the grid. Blend.js iterates over the grid for you and apply your FX on each area. Just give it come functions and chain them in the order you want.

Warning! blend.js relies on HTML5 canvas. Please refer to Can I Use to check browser compatibility.