Grab the dominant color or a complete palette from any image using pure JavaScript. Works in browsers and Node.js with zero dependencies.
Colors automatically identified from the sample image
Dominant Color
Color Palette
10 colorsColor Thief automatically detects these colors, providing both the dominant color and a palette for your design needs.
Extract beautiful color palettes from any image with pure JavaScript that works in both browsers and Node.js environments.
Just two methods to learn: getColor()
and getPalette()
. Extract the dominant color or a complete palette with minimal code.
// Browser usage
const colorThief = new ColorThief();
const img = document.querySelector('img');
// Make sure image is loaded
if (img.complete) {
const dominantColor = colorThief.getColor(img);
const palette = colorThief.getPalette(img, 5);
} else {
img.addEventListener('load', function() {
const dominantColor = colorThief.getColor(img);
const palette = colorThief.getPalette(img, 5);
});
}
Advanced algorithms identify the most prominent colors that best represent your image.
Dominant Color
Color Palette
Optimized algorithms extract colors with minimal processing time, even on large images.
Use in browsers or Node.js environments with the same simple API.
Browser
Node.js
MIT licensed and community approved with thousands of users worldwide.
Lightweight implementation with no external libraries required. Simply include and use.
Got questions about using Color Thief? We've got answers to help you get started quickly.
If your issue is unique, post a new question on Stack Overflow or check out our GitHub repository.
Get started with Color Thief in minutes. Super lightweight, zero dependencies, and works in both browser and Node.js environments.
npm install --save colorthief
const colorThief = new ColorThief();
const img = document.querySelector('img');
// Wait for image to load
img.addEventListener('load', function() {
const dominantColor = colorThief.getColor(img);
const palette = colorThief.getPalette(img, 5);
console.log(dominantColor, palette);
});
Join thousands of developers already using Color Thief to create beautiful, dynamic interfaces that respond to image content.