A little isomorphic utility that finds the dominant colour or palette of an image
JavaScript HTML
Switch branches/tags
Latest commit 5090158 Jan 17, 2017 @michaelrhodes 2.0.0
Permalink
Failed to load latest commit information.
dist Add 1.2.0 distribution builds. Nov 29, 2015
example Fix example/demo.html file path. Nov 30, 2015
lib
test Improve browser tests Jan 17, 2017
.gitignore 1.1.3 Made the cli example program more easily consumable by other pr… Mar 24, 2014
.travis.yml
cli.js 1.1.3 Made the cli example program more easily consumable by other pr… Mar 24, 2014
dominant.js
index.js
package.json
palette.js
readme.md Update dependencies Jan 17, 2017

readme.md

huey

huey is a little utility that finds the dominant colour or palette of an image. It works on the server as well as in the browser, and there’s also a command-line version.

Build status

Browser support

Demonstration

http://michaelrhodes.github.io/huey/

Install

$ npm install [-g] huey [canvas]

note: canvas is not installed alongside huey

huey requires automattic/node-canvas for its server/node variant, however, to avoid browser-only users from having to endure the native compilation process, it needs to be npm installed separately.

Usage

Recommended

var image = require('get-image-data')
var dominant = require('huey/dominant')
var palette = require('huey/palette')

image('./image.jpg', function (error, img) {
  console.log(dominant(img.data))
  // => [124, 51, 21]

  console.log(palette(img.data, 2))
  // => [[121, 50, 23], [243, 21, 23]]
})

Legacy

You should really only require code you need, but if you want the kitchen sink…

var huey = require('huey')

huey('./image.jpg', function(error, rgb, image) {
  var red = rgb[0]
  var green = rgb[1]
  var blue = rgb[2]

  // In case you want to do something
  // with the raw image data.
  console.log(
    image.data,
    image.height,
    image.width
  )
})

huey.palette('./image.jpg', 2, function(error, palette, image) {
  palette.forEach(function (rgb) {
    var red = rgb[0]
    var green = rgb[1]
    var blue = rgb[2]
  })

  // In case you want to do something
  // with the raw image data.
  console.log(
    image.data,
    image.height,
    image.width
  )
})

Legacy page weight

compression size
huey.js 13.29 kB
huey.min.js 5.57 kB
huey.min.js.gz 2.36 kB

Legacy CLI

$ huey /path/to/image
=> r, g, b

Server-implementation gotchas

huey depends on get-image-data, which in turn depends on node-canvas. Although node-canvas is a great project, its dependencies can make it hard to install. If you run into problems, I recommend checking out their install guides on the node-canvas wiki.

License

MIT