What is the most comprehensive way of expressing colors in CSS? For a majority of developers, it should be color names.
a {
color: blue; /* <- color name for #0000ff */
text-decoration: none;
}
However, color names have one critical downside; not all colors are given names. While the sRGB color space can express 16,777,216 colors, only less than 0.002% of them are given names by the CSS standard.
That's why the author has created Everycolor. With this package, all colors are given systematic names. It comes with a PostCSS plugin that converts the Everycolor names to the #123456 notation, so you can use the Everycolor names in your CSS now!
Let's see what the Everycolor names look like.
p {
background-color: redhalfwhite; /* #ff8080 */
}
Everycolor gives the name redhalfwhite to #ff8080, as this color is halfway towards white (#ffffff) from red (#ff0000). Wow, how easy it is!
Then, can you guess what name #ff4040 is? Yes, it's redquarterwhite. Now you know how to express colors you want to use!
With Everycolor, you can express every single color with names rather than hard-to-recognize numbers.
We also provide a website where you can convert color codes to Everycolor names. This is very useful for learning Everycolor quickly.
At the end, let's see a little more complicated examples.
body {
/* #14211a */
background-color: quarterimperceptiblegreensomewhatlittleslighttealsomewhatbitgray;
/* #c7eaf9 */
color: navyhalfquartersomewhatlittleimperceptiblebluetealhalfquarterlittleslightaquahalfquarterslightimperceptibleinfinitesimalwhite;
}
a {
/* #e4d923 */
color: maroonhalfquarterbitredolivehalfsomewhatlittleimperceptibleyellowsomewhatimperceptibleinfinitesimalwhite;
}
Wow, so understandable! 😍
Top comments (5)
I spent way too long trying to find one that long (and lost the hex colour in the process!), guess I will have to install it just to find out what it was 🤣🤣
I have realised this actually could serve a purpose.
Write colours down in a pad as hex values, use the output as your password, it would take eons to crack! Damn, now I can't use that as someone will add all 16 million colours to a dictionary 😋
This is hilarious 😂
Isn't this how Tailwind works? 😋
This! 🤣🤣
The last sentence gives me hope that it is a joke. 👍