
CoolHue – Coolest Gradient Hues and Swatches - nitishkmrk
https://webkul.github.io/coolhue/
======
khazhoux
These schemes remind me of Amy Gooch's 1998 SIGGRAPH paper:

"Phong-shaded 3D imagery does not provide geometric information of the same
richness as human-drawn technical illustrations. A non-photorealistic lighting
model is presented that attempts to narrow this gap. The model is based on
practice in traditional technical illustration, where the lighting model uses
both luminance and changes in hue to indicate surface orientation, reserving
extreme lights and darks for edge lines and highlights. The lighting model
allows shading to occur only in mid-tones so that edge lines and highlights
remain visually prominent. In addition, we show how this lighting model is
modified when portraying models of metal objects. These illustration methods
give a clearer picture of shape, structure, and material composition than
traditional computer graphics methods."

[http://www.cs.northwestern.edu/~ago820/SIG98/abstract.html](http://www.cs.northwestern.edu/~ago820/SIG98/abstract.html)

[http://www.cs.northwestern.edu/~ago820/SIG98/gooch98.pdf](http://www.cs.northwestern.edu/~ago820/SIG98/gooch98.pdf)

------
claudiulodro
These look great! I'm sure I'll use at least one of them in the future.

My one gripe is the copy button. It just says "CSS3 Code Copied". I have no
idea if I copied some CSS lines or just the values for a background-color or a
script that downloads malware.

~~~
pacaro
To put your mind at rest, it appears to copy a CSS background-image gradient
definition, like so:

    
    
       background-image: linear-gradient( 135deg, #FDEB71 0%, #F8D800 100%);

------
gallerdude
I always wonder why, biologically, these are so satisfying to look at. Why was
it advantageous for monkey-grandpa to like these?

~~~
torgoguys
FWIW, I don't find these gradients especially pleasing. (They're fine, but I
find some of them a bit much). I don't know why I would be different, but
there it is.

Just throwing a hypothesis out there--I'm not a Mac nor IOS guy, and if those
that find them especially pleasing by-and-large are then maybe that's the
link. Again, that's just wild speculation without any data to back it up.

Then again, some of these style gradients are used in Ubuntu graphics too (and
I again find their presence there a bit much,) so maybe there is a bigger
shift towards them.

In any event, I'm guessing it is cultural and not hardwired by monkey-grandpa
genes.

~~~
dfc
My breath was not taken away either. The first couple were fine--in the sense
that they were not offensive--but after scrolling down a little bit I started
to find the pairings a bit repulsive. I am also not an mac/ios person but I
don't know why that is relevant to aesthetic preferences.

~~~
torgoguys
> I am also not an mac/ios person but I don't know why that is relevant to
> aesthetic preferences.

You get used to what you're exposed to. What looks hip and cool in graphic
design from the 70s doesn't so pleasing today.

I don't know if MacOS or IOS uses such gradients, but I believe Apple Music at
least does (do a Google image search for Apple Music), so it is mostly a hunch
on my part.

------
Retr0spectrum
I just took a look at how this demo was implemented. The first swatch has a
hardcoded inline CSS style for the gradient, and all the rest are filled in by
some JavaScript on page load, based on the HTML tags that annotate each
swatch.

I'm curious for a couple of reasons. Why hardcode the first CSS style, and
generate the rest? If you're going to the effort of dynamically generating the
CSS styles, why not have the actual dataset stored in JSON or another easily
ingestible format, rather than in cumbersome HTML tags?

~~~
kvz
Without having checked, perhaps the result of (webpack) critical (plugin)?

------
Animats
#A0FE65 to #FA016D? Lime green to midtone red as a gradient? Ugh.

------
kingkool68
If you liked this you would also enjoy
[https://uigradients.com/](https://uigradients.com/)

------
tomglynch
Is the from colour code also meant to coloured?

------
iRobbery
why does this site mess with my 'back' history?

