Sign Up for Free

RunKit +

Try any Node.js package right in your browser

This is a playground to test code. It runs a full Node.js environment and already has all of npm’s 400,000 packages pre-installed, including colorthief with all npm packages installed. Try it out:

var colorthief = require("colorthief")

This service is provided by RunKit and is not affiliated with npm, Inc or the package authors.

colorthief v2.3.0

Get the dominant color or color palette from an image.

Color Thief

A script for grabbing the color palette from an image. Uses Javascript and the canvas tag to make it happen.

See a Demo | Read more on my blog

How to use

Import

  • /dist/color-thief.js: CommonJS module for use in Node.
  • /dist/color-thief.mjs: ES6 module for use in Browser. For modern browsers as well as Webpack and Rollup.
  • /dist/color-thief.umd.js: UMD module for use in Browser. For simple script tag loading that exposes a global variable or for RequireJS AMD support. color-thief.min.js is a duplicate of this file, kept around to maintain backwards compatibility.

Get the dominant color from an image

const colorThief = new ColorThief();
colorThief.getColor(sourceImage);

Build a color palette from an image

In this example, we build an 8 color palette.

const colorThief = new ColorThief();
colorThief.getPalette(sourceImage, 8);

API

MethodReturnDescription
getColor(image [, quality])[Number, Number, Number]WIP
getPalette(image [, colorCount, quality][[Number, Number, Number], ...]WIP
RunKit is a free, in-browser JavaScript dev environment for prototyping Node.js code, with every npm package installed. Sign up to share your code.
Sign Up for Free