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

Building your color palette

refactoringui.com

Post reply on HN
Print view View original

101–110 of 118 posts

Re: Building your color palette

#101

Post by dghf »

roryokane wrote: post #97
beaconstudios wrote: post #93

Earlier quoted context omitted.

If you want to be able to control hue still, you can use CIE LCH which is comparable to HSL but better matches our colour perception.

Yes, LCH is easier to use for picking colors than other CIELAB color spaces. To try an LCH color picker, you can use http://davidjohnstone.net/pages/lch-lab-colour-gradient-pick... (as linked in another comment). You can also use the better-implemented color picker for the HSLuv color space at http://www.hsluv.org/ . HSLuv is just like LCH except that it stretches the saturated colors for each hue so that any saturat…

> HSLuv is just like LCH

To be clear, HSLuv, is based on CIELCHuv, the cylindrical transformation of CIELUV [0]; the LCH in David Johnstone's colour picker is CIELCHab, the cylindrical transformation of CIELAB [1].

Of course, that doesn't contradict your comment about the pros and cons of HSLuv's "saturation" component.

[0] https://en.wikipedia.org/wiki/CIELUV

[1] https://en.wikipedia.org/wiki/CIELAB_color_space

Re: Building your color palette

#102

Post by ph0rque »

Nition wrote: post #73
ph0rque wrote: post #71

Earlier quoted context omitted.

> For some weird reason, we call light red "pink". This is partly cultural. In Russian, there's one word for light blue (голубое). It's the color used to describe the sky. I remember wondering why there's not an English equivalent, when there's the pink/red distinction.

The English word for the blue of the sky is "azure". Or sometimes "cerulean".

Thanks! But these words are certainly not part of the everyday vocabulary in English, like my Russian word example.

Re: Building your color palette

#103

Post by vinceguidry »

albedoa wrote: post #74
porphyrogene wrote: post #21

Earlier quoted context omitted.

Violet, Indigo and Red are different hues. Pink is not "light red". No adjustment of the saturation of red will ever make it pink. Brown is created with a low saturation of red, orange, yellow or green.

> Pink is not "light red". No adjustment of the saturation of red will ever make it pink. Can you tell us what you think one has to do with the other?

Pink is the hue between purple and red. You can't just saturate red, you also have to add a slight bit of blue.

This is pink: https://static1.squarespace.com/static/53cdd3f3e4b09b69bef6e...

You can't adjust the saturation of that color to make it red, just a lighter shade of pink. There are pink colors that are closer to red than to purple, but pink is a different part of the color space than red is.

If you see the shade in that link as red or purple, then you're living in a hell of having no rational basis by which to talk about color, or possibly color-blind.

Re: Building your color palette

#104

Post by adriand »

Nition wrote: post #73
ph0rque wrote: post #71

Earlier quoted context omitted.

> For some weird reason, we call light red "pink". This is partly cultural. In Russian, there's one word for light blue (голубое). It's the color used to describe the sky. I remember wondering why there's not an English equivalent, when there's the pink/red distinction.

The English word for the blue of the sky is "azure". Or sometimes "cerulean".

Native English speaker here (Canada) - I believe I can honestly say that I have never heard anyone refer to the colour of the sky as either of those things. Certainly never "cerulean", and I have strong doubts about "azure". In fact, because Microsoft Azure comes up in conversation relatively frequently, I have noticed that people don't even know how to pronounce it. I often hear people say "ah-zoor".

Re: Building your color palette

#105

Post by porphyrogene »

vinceguidry wrote: post #103
albedoa wrote: post #74

Earlier quoted context omitted.

> Pink is not "light red". No adjustment of the saturation of red will ever make it pink. Can you tell us what you think one has to do with the other?

Pink is the hue between purple and red. You can't just saturate red, you also have to add a slight bit of blue. This is pink: https://static1.squarespace.com/static/53cdd3f3e4b09b69bef6e... You can't adjust the saturation of that color to make it red, just a lighter shade of pink. There are pink colors that are closer to red than to purple, but pink is a different part of the color space than red is. If you see the s…

> living in a hell of having no rational basis by which to talk about color

That’s what many people on Hacker News are doing, apparently.

Re: Building your color palette

#106

Post by swaggyBoatswain »

pg_bot wrote: post #91
swaggyBoatswain wrote: post #76

Earlier quoted context omitted.

This is an interesting idea. Seems like a good practice in larger projects though. I like your choice in words, lightest, lighter, light, base, dark, darker, darkest. Its the same naming convention as tailwinds, minus the word "base". Is the word "pallete" really necessary? Why not just organize it like this instead? // Colors $blue-lightest: hsl(201, 75%, 66%); $blue-lighter: hsl(201, 75%, 61%); $blue-light: hsl(201…

The palette does two jobs. First, it makes sure you don't overwrite yourself somewhere else in the codebase. It also helps you easily see where someone has goofed since they aren't using the palette when defining a color. You could write everything that way, but you have to spend more effort maintaining the project.

Okay good point

If it's a solo project I would probably just stick to what I wrote, but for larger projects I see the benefits. Since someone might define another $color-variable elsewhere

Re: Building your color palette

#107

Post by albedoa »

vinceguidry wrote: post #103
albedoa wrote: post #74

Earlier quoted context omitted.

> Pink is not "light red". No adjustment of the saturation of red will ever make it pink. Can you tell us what you think one has to do with the other?

Pink is the hue between purple and red. You can't just saturate red, you also have to add a slight bit of blue. This is pink: https://static1.squarespace.com/static/53cdd3f3e4b09b69bef6e... You can't adjust the saturation of that color to make it red, just a lighter shade of pink. There are pink colors that are closer to red than to purple, but pink is a different part of the color space than red is. If you see the s…

Hm? Did you mean to reply to me? I am not challenging or even talking about the definition of pink. That is happening elsewhere in this thread.

Re: Building your color palette

#108

Post by [deleted] »

porphyrogene wrote: post #36
sgustard wrote: post #28

Earlier quoted context omitted.

Pink is a "light tint of red", not a different hue. https://en.wikipedia.org/wiki/Shades_of_red

That is a purely semantic argument. It's also a contradictory one. That article says in the first sentence that they are considering adjusted hues as "shades" or "tints" of red. Using terminology beyond HSV only introduces semantic complexities to confuse the topic.

[deleted]

Re: Building your color palette

#109

Post by erikpukinskis »

vinceguidry wrote: post #103
albedoa wrote: post #74

Earlier quoted context omitted.

> Pink is not "light red". No adjustment of the saturation of red will ever make it pink. Can you tell us what you think one has to do with the other?

Pink is the hue between purple and red. You can't just saturate red, you also have to add a slight bit of blue. This is pink: https://static1.squarespace.com/static/53cdd3f3e4b09b69bef6e... You can't adjust the saturation of that color to make it red, just a lighter shade of pink. There are pink colors that are closer to red than to purple, but pink is a different part of the color space than red is. If you see the s…

Huh. I always called that color magenta. And called light red pink. TIL.

Re: Building your color palette

#110

Post by jacobolus »

roryokane wrote: post #97
beaconstudios wrote: post #93

Earlier quoted context omitted.

If you want to be able to control hue still, you can use CIE LCH which is comparable to HSL but better matches our colour perception.

Yes, LCH is easier to use for picking colors than other CIELAB color spaces. To try an LCH color picker, you can use http://davidjohnstone.net/pages/lch-lab-colour-gradient-pick... (as linked in another comment). You can also use the better-implemented color picker for the HSLuv color space at http://www.hsluv.org/ . HSLuv is just like LCH except that it stretches the saturated colors for each hue so that any saturat…

“LCH” is just the same as CIELAB, but in polar coordinates.

Prefer CIELAB to CIELUV for this type of use.

Post reply on HN