Import Paint Color names from https://encycolorpedia.com/ about color-names

[cheesits456]

I copied the HTML source for https://encycolorpedia.com/named, then pretty-printed it and removed everything but the <li> tags containing the color data. I ended up with a 1,690 line file that looks like this:

I'll write a script in a bit to parse out the data we want, then manually sanitize the names and make sure none are duplicates of the current list

[cheesits456]

Alright I started working on it now.

I used this regular expression to parse the HTML: view on regexr.com*

/\t\t<li><a href=\/([0-9a-z]{6}) style=background-color:#\1(?:;color:#fff)?>(.*?)<br>#\1<\/a>/g

The RegExp defines two capture groups:

1. The six-character hexadecimal color code
2. The color name

Using Sublime Text's "Find and Replace" option, I used the stated RegExp as the "Find" field, and for "Replace" I used $2,#$1,. $2 gets replaced with the second capture group (the color name), and $1 gets replaced with the first (the hex code). The result is a properly formatted CSV file that matches the structure of the source colornames.csv file.

Now I need to sanitize the color names to be more descriptive with less words, and I also need to remove the HTML escape sequences. A couple examples of names that should be fixed are:

• Dyestalk red (lit. the color from dying with the stalk of the beni plant) (Bengara-iro)
• Weathered bamboo (lit. "sooty") (Susutake-iro)

And then I'm gonna merge the file into colornames.csv, resolve any name or hex conflicts, and finally, when all is ready, I'll submit a PR.

---

* regexr.com has a bug that can cause the pattern to fail when initially loading it:

To make the pattern load properly, add any arbitrary character to the end of the regex pattern, then delete it. After that, it should load as intended

[cheesits456]

I've run into something I'm not quite sure of - the following color definitions exist in the new data:

Chinese Black,#141414,
Chinese Blue,#365194,
Chinese Bronze,#cd8032,
Chinese Brown,#ab381f,
Chinese Gold,#cc9900,
Chinese Green,#d0db61,
Chinese Orange,#f37042,
Chinese Pink,#de70a1,
Chinese Purple,#720b98,
Chinese Red,#aa381e,
Chinese Silver,#cccccc,
Chinese Violet,#856088,
Chinese White,#e2e5de,
Chinese Yellow,#ffb200,

The way I interpret this is as a list of colors that are used in Chinese architecture. However, my concern is for situations where a user isn't presented with this full list of "Chinese" colors, but rather just a single value. In particular, the "Chinese Brown" and "Chinese Yellow" names could be interpreted as labels for skin color if no additional context is presented to the user. We can't predict all of the ways this API might be used, so that scenario is definitely a possibility.

So my question is: Should we come up with more specific names for these colors to clarify what they represent, should we simply remove the ones that could be misinterpreted, or am I possibly just overthinking this?

[cheesits456]

Welp, it's official: I'm dumb.

I finally finished manually sanitizing all ~1500 color names, then ran npm run test, only to realize that all of these colors have already been added to the list.

At least I documented my process here, so other people might potentially learn from it ¯\_(ツ)_/¯ tbh even if the only thing they learn is to check if someone's already done what you're about to do, that's okay - evidently it's a mistake that even experienced developers make :P

In my defence, I was low on sleep when I started working on this issue

[meodai]

whaaat?! Noooooo but nice effort! There are plenty of other lists that are not imported yet if you want to try your luck on an other one. It would be especially interesting to know if there was a cool way to import the diffs from the wikipedia color name page from time to time. thanks a lot for your time! I appreciate your contribution!