Extract list of supported HTML or X11 colour names and their RGB values using javascript

StackOverflow https://stackoverflow.com/questions/1551957

  •  20-09-2019
  •  | 
  •  

Question

There are places to get lists of HTML or X11 colour names and their RGB equivalents. For instance we can find that "Aquamarine" is "#70DB93". Presumably the browsers know the mappings. Is there a way to use javascript to interrogate the browser and get a list of which colour names it supports (along with the RGB the browser plans on using)?

Was it helpful?

Solution

These are meta to Javascript (they're used in CSS, amongst other things), and as a result I doubt they're queryable in that form.

Here's a list of the ones all browsers should know: CSS Color Names

From that page:

The W3C HTML and CSS standards have listed only 16 valid color names:
aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive,
purple, red, silver, teal, white, and yellow.

EDIT: Since you asked, I checked if this is doable with Safari at least. I was able to do this (I threw this together in minutes, bear with it):

<html>
<head>
    <title>Color Test</title>
    <script type="text/javascript">
        function $(id) { return document.getElementById(id); }
        function do_chocolate() {
            $("foo").style.color = "chocolate";
            alert($("foo").style.color);
        }
    </script>
</head>
<body>
    <div id="foo">
        This should change when you click below
    </div>
    <a href="#" onclick="do_chocolate();">Click me</a>
</body>

Safari shows me this alert when I click:

rgb(210, 105, 30)

I'm not familiar enough with Javascript to probe that color, but it looks like it can be done. If I were in a hurry on this project, I'd just stringize the color (like Safari did to display that alert to me) and grab each part. Since this is Javascript/DOM, however, I know there's a way to get in there and get each color component, but I don't know what it is. At least I've set you down the path, no?

OTHER TIPS

These color names that browsers like Firefox support are not HTML color names but X11 color names.

Wikipedia has a list of these colors with samples, so you can determine if a browser supports them.

I'll do some poking around to see at what point Firefox (as an example) adds this support to see if you can query for it via js.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top