HSB is a fantastic color system for designers, and I’ve written a comprehensive guide to HSB. In particular, if your LCH gradient has an ugly brown-yellow in it, try checking out the HSB version.
HSB (hue-saturation-brightness): While not perceptually uniform, sometimes HSB will offer a more interesting (and vivid) take on a gradient between two stops.(Note: the perceptually uniform nature of LCH also makes it great for data visualization color palettes)
If you were to view the gradient in grayscale, you’d see only a smooth transition from a lighter to a darker gray – preventing the awful “banding” that you’ll see in some hand-picked gradients.
LCH (luminance-chroma-hue): The default choice of this tool, LCH is an amazing color system that not only creates beautiful, rich gradients across a wide range of hues, but does so in a perceptually smooth way. Design apps, online gradient tools, and even CSS all fail in this regard – so I made this tool! Color Gradients in LCH, HSB, and HSLĬurrently, you can create gradients in 3 different color systems in this tool, which yield slightly different results. This avoids the line of gray that goes through the center of every color space. Or, to be more accurate/geeky: we interpolate the gradient in a hue-based color system, such as LCH, HSB, or HSL (not RGB) 🤓. Put simply: to get a gradient that avoids the dreaded gray dead zone ☠️, you don’t draw a straight line from A to B, you draw a biiiig curve. Why is this worth a ridiculously ominous emoji? Because it means your gradients look like this: Color geeks: this is a slight approximation, since we’re squishing a cross-section of a cube into a circle. When you try to create gradients across a wide range of hues, you often will see a gray dead zone ☠️™ in the middle of your gradient. Gradient color code generator generator#
Why this gradient generator is better than others
0 kommentar(er)
