Nervously Proposing Marriage
Have ideas to improve npm?Join in the discussion! »

blend-mode

0.0.0 • Public • Published

blend-mode

a collection of channel-level blend modes, à la photoshop (shamelessly lifted from here, via here)

install

$ npm i blend-mode

usage

var blend = require('blend-mode/soft-light')
 
// Blends two values, each between 0 and 255
// eg. pixel channel values
blend(0, 255)

example

var multiply = require('blend-mode/multiply')
 
var layer1 = [255, 128, 250, 255, 60, ...] 
var layer2 = [156, 24, 18, 223, 119, ...]
// Where both layers are Uint8ClampedArrays acquired with
// canvas.getContext('2d').getImageData(0, 0, w, h).data
 
var blended = []
// Where blended is likely a Uint8ClampedArray acquired with
// canvas.getContext('2d').createImageData(0, 0, w, h).data
 
var total = Math.min(layer1.length, layer2.length)
for (var i = 0; i < total; i += 4) {
  blended[i] = multiply(layer1[i], layer2[i])
  blended[+ 1] = multiply(layer1[+ 1], layer2[+ 1])
  blended[+ 2] = multiply(layer1[+ 2], layer2[+ 2])
 
  // don’t blend alpha channels
  blended[+ 3] = layer1[+ 3]
}

page weight (browserified)

you should really only require the blend-mode/s you actually need, but if you must have the kitchen sink, it will cost you:

compression size
blend-mode.js 3.89 kB
blend-mode.min.js 2.76 kB
blend-mode.min.js.gz 832 B

license

let’s just say MIT and hope for the best?

Install

npm i blend-mode

DownloadsWeekly Downloads

3

Version

0.0.0

License

MIT

Last publish

Collaborators

  • avatar