Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Show HN: Sorted CSS Colors – Sort the named CSS colors in a nice way

enes.in

Post reply on HN
Print view View original

81–90 of 167 posts

Re: Show HN: Sorted CSS Colors – Sort the named CSS colors in a nice way

#81

Post by tshaddox »

joegahona wrote: post #62
munificent wrote: post #38

Earlier quoted context omitted.

CSS is just an embarrassment of mistakes: white-space: nowrap So they take a word "whitespace" which needs no hyphen and jam one in. Then they take two completely distinct words "no wrap" and jam them together with no separator. And then you have to remember both of these on the same rule .

"White space" is two words, not one.

In computing it is widely used as a single word "whitespace." For example:

- The XML W3C Rec: https://www.w3.org/TR/xml/

- The HTTP 1.0 RFC: https://tools.ietf.org/html/rfc1945

However, there are exception. The Unicode character database has a property called "White_Space" which implies it is two words: http://www.unicode.org/reports/tr44/#White_Space

Re: Show HN: Sorted CSS Colors – Sort the named CSS colors in a nice way

#82

Post by runarberg »

munificent wrote: post #38
tobr wrote: post #9

Good reminder that in CSS, darkgray is a light gray and gray is a dark gray. Also presumably up is down and wet is dry.

CSS is just an embarrassment of mistakes: white-space: nowrap So they take a word "whitespace" which needs no hyphen and jam one in. Then they take two completely distinct words "no wrap" and jam them together with no separator. And then you have to remember both of these on the same rule .

This is at the top of the list in the Incomplete List of Mistakes in the Design of CSS[1]. Which has been discussed several times on HN (last 2 months ago)[2].

1: https://wiki.csswg.org/ideas/mistakes

2: https://news.ycombinator.com/item?id=25891435

Re: Show HN: Sorted CSS Colors – Sort the named CSS colors in a nice way

#83

Post by smoe »

tobr wrote: post #9

Good reminder that in CSS, darkgray is a light gray and gray is a dark gray. Also presumably up is down and wet is dry.

This just reminded me of the first bug of my career that took me hours trying to figure out. Colors weren't working correclty in IE 6 (pre IE Developer Tools) and I eventually learned that Firefox accepted both spellings "gray" and "grey", whereas IE only one of them.

Don't remember which one I used, but do remember that I went home early that day after that :/

Re: Show HN: Sorted CSS Colors – Sort the named CSS colors in a nice way

#84

Post by Minor49er »

knuptfad wrote: post #6
Minor49er wrote: post #4

This is really cool. The whole experience is slick! One thing I noticed is that some colors appear brighter, but are further down on the Saturation scale. For example, mediumturquoise and turquoise are shown as being less saturated than cyan, though cyan doesn't mix in any gray. Are these sorted by the sums of their RGB values? I'm also not too well versed in color theory, so I could be missing or misunderstanding so…

Thanks, I'm glad! :) I think there's a misunderstanding there. Mediumturquoise and turquoise are both located above cyan, which means they are brighter as the vertical axis is the lightness. Also, to answer your question, colors are sorted by their hue, saturation and lightness values. So, it's actually a 3D color visualizer, where one dimension (hue) is reduced into just a slider at the top, and the other two dimens…

That makes sense. Thank you!

Re: Show HN: Sorted CSS Colors – Sort the named CSS colors in a nice way

#85

Post by runarberg »

buzzerbetrayed wrote: post #64
cialowicz wrote: post #29

Earlier quoted context omitted.

'Brown' is dark red, and to my eye 'sienna' has very little red in it. To get actual brown, you need 'saddlebrown'. CSS is super weird.

I tried to find brown on the slider to see what you’re talking about. Took me ages. Turns out you have to go REALLY red in order to find brown.

Turns out brown is a really interesting color: https://www.youtube.com/watch?v=wh4aWZRtTwU

Re: Show HN: Sorted CSS Colors – Sort the named CSS colors in a nice way

#87

Post by wmil »

edwinyzh wrote: post #11

It's neat! Slightly offtopic - I saw one of the colors named "peru", does the name has any connection with Peru the country?

Yes, Peru used to export pottery with a distinct brown colour. Prior to cheap air travel travelling to Peru was rare but the pottery was common. So "Peru pottery brown" was just called "Peru" when talking about colours.

Re: Show HN: Sorted CSS Colors – Sort the named CSS colors in a nice way

#89

Post by avianlyric »

mcv wrote: post #23
formerly_proven wrote: post #17

I had no idea there were this many named colors in CSS. Turns out there are 16 HTML colors (upped to a whoppin' 17 colors in HTML4/CSS2.1) and around 124 named colors which originally came in due to X11. Since then, several colors have been added through various standards updates for a total of around 147 colors.

Some of these colour names make little sense. For example, 'chocolate' is surprisingly light. 'brown' is red.

Worth watching the Technology Connection video on the colour Brown [1]. It's a strange colour that only really exists when placed in the context of other colours, not something that can really be produced by a pure RGB light source, which explains why the CSS Brown colour looks red.

[1]: https://www.youtube.com/watch?v=wh4aWZRtTwU

Re: Show HN: Sorted CSS Colors – Sort the named CSS colors in a nice way

#90

Post by avianlyric »

cialowicz wrote: post #29
tobr wrote: post #9

Good reminder that in CSS, darkgray is a light gray and gray is a dark gray. Also presumably up is down and wet is dry.

'Brown' is dark red, and to my eye 'sienna' has very little red in it. To get actual brown, you need 'saddlebrown'. CSS is super weird.

Worth watching the Technology Connection video on the colour Brown [1]. It's a strange colour that only really exists when placed in the context of other colours, not something that can really be produced by a pure RGB light source, which explains why the CSS Brown colour looks red.

[1]: https://www.youtube.com/watch?v=wh4aWZRtTwU

Post reply on HN