![]() ![]() HSL saturation saturation has a fixed range from 0 (gray) to 100 (purest).In general, however, these values describe the intensity or richness of a color. Get started LCH Chroma vs HSL SaturationĬomparing Chroma and Saturation is a bit tricky because they work in different ways. Whether you're new to color palettes, or a pro looking for advanced tools, create your best palette in minutes. On the other hand in LCH both yellow and blue are gradually increasing in lightness and the yellow shades don't look any lighter than the blue ones. This is a fundamentally incorrect way of describing the lightness of color because the yellow looks much lighter than the blue with the same HSL lightness value. That's because there is no black or white mixed in, it's just the pure hue. Notice how the HSL colors are the most vibrant and colorful with the lightness of 50. Each shade has maximum chroma or saturation and we are only changing the lightness value. In the example below we see the same hue of Blue and Yellow represented in HSL and LCH. LCH lightness describes the relative brightness of a color compared to a similarly illuminated white.For example, a light blue color can be created by adding white to a pure blue hue. ![]() HSL lightness resembles the amount of black or white added to a pure color.However, each space goes about it differently. Lightness describes the relative brightness of a color. ![]() Let's take a closer look at each component of LCH separetly. At first glance, this might seem similar to HSL (Hue, Saturation, and Lightness), but these color spaces describe colors in different ways. LCH stands for Lightness, Chroma, and Hue. This means that it can represent a wider range of colors, allowing for even more beautiful websites. In theory, LCH can describe an infinite number of colors, but what is important for us is that its color gamut is larger than that of sRGB. The main goal of LCH is to achieve perceptual uniformity, meaning that it behaves according to how our eyes perceive color. The CIE is the international authority on light, illumination, color, and color spaces. LCH color space, also known as HCL, CIELAB, LAB, CIELUV, or CIELCH is a color space that was first defined in 1976 by International Commission on Illumination (CIE), hence the name CIELAB. This makes it less than ideal for creating consitent and accessible color systems. Additionally, sRGB was designed based on how displays work, rather than how our eyes perceive color. sRGB is limited to 16.7 million colors which might seem like a lot, but with the rapid evolution of displays, it is now common to have displays with more than 100% sRGB coverage. ![]() What is LCH?įor the past few decades, we’ve been using sRGB color space on the Web. In this blog post, we will explore the details of LCH, compare it to the HSL color space, and discuss how it can benefit you in your design work. This quality, known as perceptual uniformity, makes LCH an excellent choice for creating accessible, consistent, and predictable color systems in design. LCH is a color space designed to represent colors in a way that is more similar to how the human eye perceives them. ![]()
0 Comments
Leave a Reply. |