Help

Re: Converting hex values to the nearest color name

2927 1
cancel
Showing results for 
Search instead for 
Did you mean: 
Vignisson
5 - Automation Enthusiast
5 - Automation Enthusiast

does anyone know a way to convert hexadecimal values to actual color names (or the nearest neighbour).

Examples:
#ffffff = white
#eeeeee = light grey
#45c1f6 = light blue

11 Replies 11

I would check out the color palette app!

I have. It does not convert hex codes automatically, by formula, into color names. What I need is to take hundreds of items and automatically detect the primary color of each item (I have done already that with miniExtensions) and render the resulting hex value out as the official “HTML color name” in a seprate field.

What about hex colors that do not have an official html/css name?

You could use a very long switch statement for the most common colors, but there are too many possible color to include every color.

That is exactly the dilemma, there are way too many options, hence the “(or the nearest neighbour)”. Ideally 12-15 main colors would do the trick. The purpose is to automatically generate “filter by color”, information that would help to filter those items in online store.

I hope you’re not trying to do this in a formula field.

This is the javascript code you want and it will work in a Script Block or a Script Automation. And if Airtable would simply make it possible to call script apps as functions, it could also be a formula. [sigh]

To add to @Bill.French’s JavaScript solution, here’s a reference table you could add to your base for creating cross-references:

Data courtesy of XKCD and Stitch Fix.

This is very cool - and doesn’t this mean you could use a formula to perform the lookups pretty easily?

I think you could with exact matches, at least — of which there is the possibility for many. However, if “nearest neighbor” matching is still needed beyond the scope of the colors provided here (I’m sure there are millions of actual potential hex-color outputs), there will still be a need for JavaScript. But having all these color references may provide a richer data set for that JavaScript to operate on.

But it’s also possible there are simple rules that govern how hex codes map to color outputs that could be expressed in a JavaScript algorithm — if so, I don’t know what those rules are. :man_shrugging:t2:

I just happened to be in possession of this, rather large, color data set, and discovered this post. Thought it might end up being useful for something here.

URTM @Bill.French. I didn’t dare to start playing with this as a formula :winking_face:
Now as a non-coder this looks like Spanish to me. You know, I can manage to order a chicken in Barcelona by looking at the pictures on the menu and then figure out some key words to tell the waiter. :upside_down_face:
But this really helps to get closer to the solution, I’m sure. I will have one of my friends having a look at it and see if we can figure out how to take advantage of the code. Thank you so very much for taking your time to find it and share with us!

This is indeed a treasure, thank you so much @Jeremy_Oglesby! As @Bill.French suggests it’s very easy to perform a look up on this. And it is grouped by “Color family” which is ALMOST what I was hoping for. My guess is that with a little observation I could just simplify the Color family description by joining some of them, resulting in 12-15 “families” that I could perform a lookup on. :nerd_face:
I’m sure this base will also be worth hanging on to for other scenarios in different projects. :ok_hand:

This little video from the Stitch Fix Article I posted describes the intention of the hierarchy (really interesting article, btw – whether you are into fashion or not, their data-science team is top-notch):

CleanShot 2020-10-19 at 10.29.41

So the color names in the xkcd_colors field are all unique - 949 of them (some of them are less than savory names, since they were named via internet polling :winking_face: ). Those are grouped to a nearest design_color, presumably so that Stitch Fix could 1) reduce the field of color names to provide more clarity for its design team, and 2) provide more appropriate and marketable names in many cases. Then the design_colors are grouped back to a nearest common_color, to reduce the field of names further, and provide a simple scheme. Finally, those are grouped back to a color_family.

The color_type and color_or_neutral are more descriptive tags than part of the hierarchy themselves.

So really, this data could probably be even more useful if it were broken up into related tables:

  • XKCD Colors Table

    • Each belongs to a Design Color
  • Design Colors Table

    • Each has many XKCD Colors
    • Each belongs to a Common Color
  • Common Colors Table

    • Each has many Design Colors
    • Each belongs to a Color Family
  • Color Families Table

    • Each has many Common Colors