Due to publishing limitations, the groups of colors in this post are inserted as images. For the original version with embedded HTML and clickable names, see the original post Note: https://austingil.com/css-named-colors/ Did you know that CSS has Named Colors? Yeah, you’re probably familiar with “white” or “black”. But did you know there are keywords? 148 named color Some of them are silly, some are common, and some are downright useless. Who’s going to think, “You know what color we need here? Freakin’ blanchedalmond!” I don’t know why, but I absolutely love named colors, so I put together this collection of things I thought were helpful, cool, interesting, or funny. Organized By Group Reds Oranges Yellows Greens Blues Purples Browns Greys My favorite colors Color palettes Bold Pastel Neon Purps Synthwave Pointless facts Colors that make me hungry Colors experiencing identity crisis Names for exotic dancers Names for ninjas CSS Named Colors Organized by Group Most of the time, when I’m looking for something to do with named colors, I’m looking for a complete list of all the choices. I couldn’t find one I liked, so I made this one. Reds Oranges Yellows Greens Blues Purples Browns Greys (or Grays) My Favorite CSS Named Colors Cool Palettes Made With CSS Named Colors Just having a bunch of colors to choose from isn’t always helpful. I like having go-to palettes to make my life easier. I’m a big fan of neons, pastels, and purples, but I’m hardly a talented designer, so here we are. Please let me know if you have any more to add. :) Bold Pastel Neon Purps Synthwave Pointless Facts About CSS Named Colors The Colors “cyan” and “aqua” Have the Same Hex Value ( ). As Do “fuchsia” and “magenta” ( ). #00ffff #ff00ff It seems they couldn’t decide whether it should be spelled “gray” or “grey” so they went with both: gray/grey darkgray/darkgrey slategray/slategrey darkslategray/darkslategrey dimgray/dimgrey lightslategray/lightslategrey lightgray/lightgrey “dimgray” is darker than “gray” which is darker than “darkgray” (which makes no sense at all) which is darker than “lightgray” (ok, back on track). There are four different “goldenrod” options, but only “lightgoldenrodyellow” explicitly includes “yellow”. Greens have the most representation (26) and oranges have the least representation (11). This is, however, subjective due to how I narrowed the categories down to 7 different colors. Many of the colors are between two options and could go either way. And colors will appear different across browsers, devices, brightness, hell, even the tilt of your screen. And one last, not-so-pointless fact, the color “ ” was as a tribute to the life of Rebecca Alison Meyer, daughter of Eric Meyer. rebeccapurple added to the CSS spec in 2014 CSS Named Colors That Make Me Hungry bisque blanchedalmond chocolate darkolivegreen darkorange darksalmon honeydew lightsalmon lime limegreen mintcream olive olivedrab orange orangered papayawhip peachpuff plum salmon tomato wheat CSS Named Colors With an Identity Crisis “brown” is definitely a red. “darkslategray”/“darkslategrey” is more like a dark green. “darkslateblue” should have been darkslatepurple. “blueviolet” is just purple. CSS Named Colors For Exotic Dancers burlywood goldenrod palegoldenrod darkgoldenrod hotpink lavenderblush CSS Named Colors For Ninjas There’s really only one and it’s so good: “whitesmoke” Thank you so much for reading. If you liked this article, please . It’s one of the best ways to support me. You can also , or if you want to know when new articles are published. share it sign up for my newsletter follow me on Twitter Originally published on . austingil.com

CSS Named Colors: Everything Explained

Too Long; Didn't Read

@austingil

RELATED STORIES