lch()
The lch()
functional notation expresses a given color in the LCH color space. It has the same L axis as lab()
, but uses polar coordinates C (Chroma) and H (Hue).
Syntax
lch(29.2345% 44.2 27);
lch(52.2345% 72.2 56.2);
lch(52.2345% 72.2 56.2 / .5);
Values
- Functional notation:
lch(L C H [/ A])
-
L
specifies the CIE Lightness, and is a<percentage>
between0%
representing black and100%
representing white.The second argument
C
is the chroma (roughly representing the "amount of color"). Its minimum useful value is 0, while its maximum is theoretically unbounded (but in practice does not exceed 230).The third argument
H
is the hue angle.0deg
points along the positive "a" axis (toward purplish red),90deg
points along the positive "b" axis (toward mustard yellow),180deg
points along the negative "a" axis (toward greenish cyan), and270deg
points along the negative "b" axis (toward sky blue).A
(alpha) can be a<number>
between0
and1
, or a<percentage>
, where the number1
corresponds to100%
(full opacity).
Specifications
Specification |
---|
CSS Color Module Level 4 # lab-colors |
Browser compatibility
BCD tables only load in the browser
See also
- LCH colors in CSS: what, why, and how?
- Safari Technology Preview 122 release notes: includes
lch()
andlab()
colors.