Skip to content

colorjs/color-namer

master
Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?
Code

Latest commit

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
November 26, 2014 22:18
July 13, 2019 21:12
August 24, 2019 19:10
August 25, 2019 11:57
December 28, 2015 19:13
July 13, 2019 21:10
July 13, 2019 21:10
August 24, 2019 19:10
August 24, 2019 19:10

Color Namer Build Status

Give me a color and I'll name it.

Color Namer is an npm package for use in Node.js or the browser that calculates color distance using the Delta-E color difference technique. Given a color in Hexadecimal RGB, RGBA, HSL, or HSV format, it converts the color to the Lab* color space, then calculates the color's Euclidean distance from a set of colors with known names.

Mike Bostock of D3 fame explains it well:

Lab and HCL color spaces are special in that the perceived difference between two colors is proportional to their Euclidean distance in color space. This special property, called perceptual uniformity, makes them ideal for accurate visual encoding of data. In contrast, the more familiar RGB and HSL color spaces distort data when used for visualization.

Lists

The color names are derived from several lists:

Installation

npm install color-namer --save

Usage

Require the module:

var namer = require('color-namer')
var names = namer("#FF0000")

From the above code, names will have a key for each list:

names.roygbiv
names.basic
names.html
names.x11
names.pantone
names.ntc

Each list is an array of colors, sorted by their perceptual similarity to the given color:

[
  { name: 'red',
    hex: '#FF0000',
    distance: 0
  },{
    name: 'orangered',
    hex: '#FF4500',
    distance: 13.170205025755513
  },{
    name: 'tomato',
    hex: '#FF6347',
    distance: 31.733444038510665
  },{
    name: 'crimson',
    hex: '#DC143C',
    distance: 35.38084849496472
  },{
    name: 'firebrick',
    hex: '#B22222',
    distance: 40.71076805218006
  },{
    name: 'coral',
    hex: '#FF7F50',
    distance: 42.340752375722616
  },{
    name: 'chocolate',
    hex: '#D2691E',
    distance: 44.378454180212145
  }
]

Other input format work too like HSL, RGB, and RGBA:

name("hsl(50,100%,50%)")
name("rgb(255,0,0)")
name("rgba(255,0,0,1)")

Options

options.pick

This option allows us to derive names from the dedicated lists for faster computation.

var names = namer(color, { pick: ['basic', 'x11'] })
// output: { basic: [...], x11: [...] }

options.omit

The opposite of options.pick.

var names = namer(color, { omit: ['pantone', 'roygbiv'] })
// output: { basic: [...], html: [...], x11: [...], ntc: [...] }

options.distance

If 'deltaE', use the Delta-E distance function, otherwise uses default distance function.

var names = namer(color, { pick: ['basic'], distance: 'deltaE' });
// output: { basic: [...] }

Tests

npm install
npm test

License

MIT