Convert RGB to ColorName String Javascript

Question

I want to find out if a DOM Element has a style which is for example a color:Red. If this is defined on the inline style just like

<input type="text" style="color:Red">

I can get it easily with JavaScript

But how about if it's defined on a role - I mean as a css class and assign the class to the DOM Element

With javascript I know I can get the color with some method call computedStyle and give it the name of the property but it brings me the color in RGB numbers mode in Firefox and in IE it gets the color name

my question here is how to convert RGB into a simple color name?

I would say that there's nothing to do this automatically since it has no apparent use. Using RGB should work all the times. Even if you need to compare it. — tiagoboldt, Mar 30 '11 at 13:17
@tiagoboldt "No apparent use", that seems short sighted.... I am developing a tool to help designers pick colors, and while the backend uses rgba() it's helpful to show users `red` in addition to `rgb(255,0,0)` and the other ways of defining the given color. Especially if they input a named color as their primary color, they'd likely expect to see their named color spit back to them in the final color palette. — Micah Lindstrom, May 07 '20 at 02:26

score 11 · Answer 1 · answered Aug 22 '11 at 19:17

11

Here is the library that will do it: Name That Color - http://chir.ag/projects/name-that-color/

answered Aug 22 '11 at 19:17

SiburNY

139
1
6

score 4 · Answer 2 · edited May 23 '17 at 12:34

4

There's a sample function you could call in this answer:

Javascript function to convert color names to hex codes

It does a conversion from the name to the hex value.

edited May 23 '17 at 12:34

Community

1
1

answered Mar 30 '11 at 13:22

jaygooby

2,396
23
42

This is the wrong direction -- OP wants from hex code to color name, this answer is for from color name to hex code. – Micah Lindstrom May 05 '20 at 09:37

score 2 · Answer 3 · answered Mar 30 '11 at 13:18

2

I think that these are the names supported in most browsers, you could store them in a dictionary and look them up: http://www.febooti.com/products/iezoom/online-help/html-color-names-x11-color-chart.html

The x11 color names are a superset of the ones defined in css.

answered Mar 30 '11 at 13:18

Douglas

35,066
8
72
89

1

2020-05-05 Link is broken – Micah Lindstrom May 05 '20 at 09:38

score 2 · Answer 4 · answered Mar 30 '11 at 13:20

A color name to RGB converter look up table will help, start here: http://web.njit.edu/~walsh/rgb.html.
On the other hand someone might have build it before, so try to google it: https://encrypted.google.com/search?num=100&q=SlateGray1+SlateGray2+inurl%3A.js

score 1 · Answer 5 · answered Nov 20 '18 at 15:25

1

Checkout this project https://github.com/evansque/coloraze and here is the node module for it https://www.npmjs.com/package/coloraze

answered Nov 20 '18 at 15:25

Evan Lévesque

2,801
7
36
60

score 1 · Answer 6 · answered May 07 '20 at 02:21

Check out the https://www.w3schools.com/lib/w3color.js conversion script. It is very comprehensive, converting between named colors, hex, hsl, hwb, cmyk, and ncol It does not, however, support colors with alpha

An easy web interface is also provided at https://www.w3schools.com/colors/colors_converter.asp

Convert RGB to ColorName String Javascript

6 Answers6

Linked