@@ -1685,13 +1685,16 @@ Device-independent Colors: Lab and LCH
1685
1685
CIE L*a*b*, because that is what people write in practice -->
1686
1686
1687
1687
Lab is a rectangular coordinate system with a central Lightness axis.
1688
- L=0 is deep black (no light at all)
1689
- while L=100 is a diffuse white
1688
+ This value is usually written as a unitless number;
1689
+ for compatibility with the rest of CSS, it is written as a percentage.
1690
+ 100% means an L value of 100, not 1.0.
1691
+ L=0% is deep black (no light at all)
1692
+ while L=100% is a diffuse white
1690
1693
(the illuminant is D50 white, a standardized daylight spectrum with a color temperature of 5000K,
1691
1694
as reflected by a perfect diffuse reflector).
1692
1695
Values greater than 100 would correspond to specular highlights,
1693
1696
but their precise color is undefined in this specification.
1694
- Usefully, L=50 is mid gray, by design,
1697
+ Usefully, L=50% is mid gray, by design,
1695
1698
and equal increments in L are evenly spaced visually:
1696
1699
the Lab color space is intended to be perceptually uniform .
1697
1700
The a and b axes convey hue;
@@ -1715,54 +1718,52 @@ Device-independent Colors: Lab and LCH
1715
1718
is the industry standard chromatic adaptation transform,
1716
1719
and is easy to calculate as it is a simple matrix multiplication.
1717
1720
1721
+ LCH has the same L axis as Lab,
1722
+ but uses polar coordinates C (chroma) and H (hue).
1723
+ C is the geometric distance from the L axis
1724
+ and H is the angle from the positive a axis,
1725
+ with positive angles being more clockwise.
1718
1726
1719
- In Lab if two colors have the same L value,
1727
+ In Lab and LCH, if two colors have the same L value,
1720
1728
they appear to have the same visual lightness--
1721
1729
regardless of how different their hues are.
1722
- This is different from HSL,
1723
- where for example blue (#00F) and yellow (#FF0) have the same HSL lightness
1724
- despite yellow being obviously far lighter than blue.
1725
1730
1726
1731
1728
1733
1729
- LCH has the same L axis as Lab,
1730
- but uses polar coordinates C (chroma) and H (hue).
1731
- C is the geometric distance from the L axis
1732
- and H is the angle from the positive a axis,
1733
- with positive angles being more clockwise.
1734
-
1735
- Note: The Lightness axis in Lab should not be confused with the L axis in HSL.
1734
+ Note: The Lightness axis in Lab and LCH should not be confused with the L axis in HSL.
1736
1735
For example, in HSL, the sRGB colors blue (#00F) and yellow (#FF0)
1737
1736
have the same value of L even though visually, blue is much darker.
1738
1737
In Lab, if two colors have the same measured L value,
1739
1738
they have identical visual lightness.
1740
1739
HSL and related polar RGB models were developed
1740
+ in an attempt
1741
1741
to give similar usability benefits for RGB that LCH gave to Lab.
1742
1742
1743
1743
1744
1744
1745
1745
1746
- Specifying Lab and LCH: the lab() and lch() functional notations
1746
+ Specifying Lab and LCH: the '' lab()'' and '' lch()'' functional notations
1747
1747
1748
1748
1749
1749
CSS allows colors to be directly expressed in Lab and LCH.
1750
1750
1751
1751
1752
- lab() = lab( <<number >> <> <> [ / <> ]? )
1752
+ lab() = lab( <<percentage >> <> <> [ / <> ]? )
1753
1753
1754
1754
1755
1755
The first argument specifies the CIE Lightness.
1756
- This is typically a number between ''0''
1756
+ This is typically a number between ''0% ''
1757
1757
(representing black)
1758
- and ''100''
1758
+ and ''100% ''
1759
1759
(representing white),
1760
- similar to the lightness argument of ''hsl()'' .
1760
+
1761
1762
However, CIE Lightness can exceed this range on some systems,
1762
1763
with extra-bright whites using a lightness up to ''400'' .
1763
- Values less than ''0'' must be clamped to ''0'' at computed-value time;
1764
+ Values less than ''0% '' must be clamped to ''0% '' at computed-value time;
1764
1765
values greater than
1765
- ''100'' are permitted (for forwards compatibility with High Dynamic Range (HDR),
1766
+ ''100% '' are permitted (for forwards compatibility with High Dynamic Range (HDR),
1766
1767
and must not be clamped.
1767
1768
1768
1769
The second and third arguments are the distances along the "a" and "b" axises
@@ -1778,7 +1779,7 @@ Specifying Lab and LCH: the lab() and lch() functional notations
1778
1779
and interpreted identically to the
<> in
''rgb()'' .
1779
1780
1780
1781
1781
- lch() = lch( <<number >> <> <> [ / <> ]? )
1782
+ lch() = lch( <<percentage >> <> <> [ / <> ]? )
1782
1783
1783
1784
1784
1785
The first argument specifies the CIE Lightness,
@@ -1792,13 +1793,14 @@ Specifying Lab and LCH: the lab() and lch() functional notations
1792
1793
If the provided value is negative,
1793
1794
it is clamped to ''0'' at computed-value time.
1794
1795
1795
- The third argument is the hue.
1796
- It's interpreted identically to the <> argument of ''hsl()'' ,
1797
- but doesn't map hues to angles in the same way.
1798
- Instead, ''0deg'' points along the positive "a" axis (toward red),
1799
- ''90deg'' points along the positive "b" axis (toward yellow),
1800
- ''180deg'' points along the negative "a" axis (toward green),
1801
- and ''270deg'' points along the negative "b" axis (toward blue).
1796
+ The third argument is the hue angle.
1797
+ It's interpreted similarly to the <> argument of ''hsl()'' ,
1798
+ but doesn't map hues to angles in the same way
1799
+ because they are evenly spaced perceptually.
1800
+ Instead, ''0deg'' points along the positive "a" axis (toward purplish red),
1801
+ ''90deg'' points along the positive "b" axis (toward mustard yellow),
1802
+ ''180deg'' points along the negative "a" axis (toward greenish cyan),
1803
+ and ''270deg'' points along the negative "b" axis (toward sky blue).
1802
1804
If the provided value is negative,
1803
1805
or is greater than or equal to ''360deg'' ,
1804
1806
it is set to the value modulo 360.
0 commit comments