From f58cd1c5766260a3db6da7740f840a904ba7be79 Mon Sep 17 00:00:00 2001 From: Chris Lilley Date: Wed, 4 Dec 2024 14:20:49 -0500 Subject: [PATCH] [css-color][editorial] Consistent capitalization OKLCh, fix #7880 --- css-color-4/Overview.bs | 138 ++++++++++++++++++++-------------------- css-color-5/Overview.bs | 30 ++++----- 2 files changed, 84 insertions(+), 84 deletions(-) diff --git a/css-color-4/Overview.bs b/css-color-4/Overview.bs index 27d1e2485f0..a8cb05f2cd9 100644 --- a/css-color-4/Overview.bs +++ b/css-color-4/Overview.bs @@ -904,7 +904,7 @@ Representing Colors: the <> type * ''oklch()'' , which specifies an Oklab color by Oklab Lightness, Chroma, and hue - using the [[#ok-lab|Oklch]] cylindrical coordinate model. + using the [[#ok-lab|OKLCh]] cylindrical coordinate model. -

A disadvantage of HSL over Oklch +

A disadvantage of HSL over OKLCh is that hue manipulation changes the visual lightness, and that hues are not evenly spaced apart.

@@ -2258,12 +2258,12 @@ HSL Colors: ''hsl()'' and ''hsla()'' functions Both have an HSL Lightness of 50%, but clearly the yellow looks much lighter than the blue. - In Oklch, sRGB blue is + In OKLCh, sRGB blue is  ''oklch(0.452 0.313 264.1)'' while sRGB yellow is  ''oklch(0.968 0.211 109.8)''. - The Oklch Lightnesses of 0.452 and 0.968 clearly reflect + The OKLCh Lightnesses of 0.452 and 0.968 clearly reflect the visual lightnesses of the two colors. @@ -2291,7 +2291,7 @@ HSL Colors: ''hsl()'' and ''hsla()'' functions  ''hsl(80deg 100% 50%)'', which also have a hue difference of 80-50 = 30deg, look very different. - In Oklch, the same pair of colors + In OKLCh, the same pair of colors  ''oklch(0.533 0.26 262.6)'' and  ''oklch(0.462 0.306 268.9)'' @@ -3056,7 +3056,7 @@ Examples of HWB Colors -->

-Device-independent Colors: CIE Lab and LCH, Oklab and Oklch

+Device-independent Colors: CIE Lab and LCH, Oklab and OKLCh

CIE Lab and LCH

@@ -3211,14 +3211,14 @@ Device-independent Colors: CIE Lab and LCH, Oklab and Oklch This does not help with hue curvature, however. -

Oklab and Oklch

+

Oklab and OKLCh

This section is not normative. Recently, Oklab, an improved Lab-like space has been developed [[!Oklab]]. - The corresponding polar form is called Oklch. + The corresponding polar form is called OKLCh. It was produced by numerical optimization of a large dataset of visually similar colors, and has improved hue linearity, @@ -3245,12 +3245,12 @@ Device-independent Colors: CIE Lab and LCH, Oklab and Oklch The illuminant is [=D65=], the same white point as most RGB color spaces. - Oklch has the same L axis as Oklab, + OKLCh has the same L axis as Oklab, but uses polar coordinates C (chroma) and H (hue). Note: Unlike CIE LCH, where Chroma can reach values of 200 or more, - Oklch Chroma ranges to 0.5 or so. - The hue angles between CIE LCH and Oklch are broadly similar, + OKLCh Chroma ranges to 0.5 or so. + The hue angles between CIE LCH and OKLCh are broadly similar, but not identical.
@@ -3262,10 +3262,10 @@ Device-independent Colors: CIE Lab and LCH, Oklab and Oklch
-
+
diagram showing hue constancy in Oklch -
A constant Oklch hue slice, + alt="diagram showing hue constancy in OKLCh"> +
A constant OKLCh hue slice, showing the sRGB gamut around primary blue. The visual hue remains constant.
@@ -3462,9 +3462,9 @@ Specifying Lab and LCH: the ''lab()'' and ''lch()'' functional notations Using commas inside these functions is an error.

- Specifying Oklab and Oklch: the ''oklab()'' and ''oklch()'' functional notations

+ Specifying Oklab and OKLCh: the ''oklab()'' and ''oklch()'' functional notations - CSS allows colors to be directly expressed in Oklab and Oklch. + CSS allows colors to be directly expressed in Oklab and OKLCh. 
 	oklab() = oklab( [ <> | <> | none]
@@ -3583,8 +3583,8 @@ Specifying Lab and LCH: the ''lab()'' and ''lch()'' functional notations
 			parsing/color-valid.html
 		
 
-		In Oklch
-		the first argument specifies the Oklch Lightness L,
+		In OKLCh
+		the first argument specifies the OKLCh Lightness L,
 		interpreted identically to the Lightness argument of ''oklab()''.
 
 		The second argument is the chroma C.
@@ -3608,9 +3608,9 @@ Specifying Lab and LCH: the ''lab()'' and ''lch()'' functional notations
 		separated by a slash,
 		representing the [=alpha component=].
 
-		If the chroma of an Oklch color is ''0%'' or 0,
+		If the chroma of an OKLCh color is ''0%'' or 0,
 		the hue component is [=powerless=].
-		If the lightness of an Oklch color is ''0%'' or 0,
+		If the lightness of an OKLCh color is ''0%'' or 0,
 		or ''100%'' or 1.0,
 		the color will be displayed as black, or white, respectively
 		due to gamut mapping to the display.
@@ -3634,7 +3634,7 @@ Specifying Lab and LCH: the ''lab()'' and ''lch()'' functional notations
 
 
 

-Converting Lab or Oklab colors to LCH or Oklch colors

+Converting Lab or Oklab colors to LCH or OKLCh colors
 
 	Conversion to the polar form is trivial:
 
@@ -3649,11 +3649,11 @@ although the visual color does not change from being on the neutral axis,
 small changes to the values can result in the reported hue angle swinging about wildly
 and being essentially random.
 In CSS, this means the hue is [=powerless=],
-and treated as [=missing=] when converted into LCH or Oklch;
+and treated as [=missing=] when converted into LCH or OKLCh;
 in non-CSS contexts this might be reflected as a missing value, such as NaN.
 
 

-Converting LCH or Oklch colors to Lab or Oklab colors

+Converting LCH or OKLCh colors to Lab or Oklab colors
 
 	Conversion to the rectangular form is trivial:
 
@@ -4653,7 +4653,7 @@ Color Space for Interpolation
 	* If colors need to be evenly spaced perceptually (such as in a gradient),
 		the Oklab color space (and the older Lab), are designed to be perceptually uniform.
 	* If avoiding graying out in color mixing is desired, i.e. maximizing chroma throughout the transition,
-		Oklch (and the older LCH) work well for that.
+		OKLCh (and the older LCH) work well for that.
 	* Lastly, compatibility with legacy Web content may be the most important consideration.
 		The sRGB color space, which is neither linear-light nor perceptually uniform, is the choice here,
 		even though it produces poorer results (overly dark or greyish mixes).
@@ -4826,13 +4826,13 @@ Interpolating with Missing Components
 
 	

 		For example, if these two colors
-		are to be interpolated in Oklch,
+		are to be interpolated in OKLCh,
 		the missing hue in the CIE LCH color
-		is analogous to the hue component of Oklch
+		is analogous to the hue component of OKLCh
 		and will be carried forward
 		while the missing blue component
 		in the second color
-		is not analogous to any Oklch component
+		is not analogous to any OKLCh component
 		and will not be carried forward:
 
 		
@@ -4913,7 +4913,7 @@ Interpolating with Missing Components
 			 oklch(39.2% 0.4 0 / 0.5)
 		

 
-		giving the premultiplied Oklch values [0.3915, 0.054, 326] and [0.196, 0.2, 0].
+		giving the premultiplied OKLCh values [0.3915, 0.054, 326] and [0.196, 0.2, 0].
 	

 
 	If both colors are [=missing=]
@@ -5097,7 +5097,7 @@ Hue Interpolation
 	between the starting and ending hues.
 
 	

-		For example, the midpoint when interpolating in Oklch from a red
+		For example, the midpoint when interpolating in OKLCh from a red
 		 oklch(0.6 0.24 30) to a yellow
 		 oklch(0.8 0.15 90)
 		would be at a hue angle of 30 + (90 - 30) * 0.5 = 60 degrees,
@@ -5123,7 +5123,7 @@ Hue Interpolation
 	between the starting and ending hues.
 
 	

-		For example, the midpoint when interpolating in Oklch from a red
+		For example, the midpoint when interpolating in OKLCh from a red
 		 oklch(0.6 0.24 30) to a yellow
 		 oklch(0.8 0.15 90)
 		would be at a hue angle of (30 + 360 + 90) * 0.5 = 240 degrees,
@@ -5158,7 +5158,7 @@ Hue Interpolation
 	the interpolation will not flip to the other arc.
 
 	

-		For example, the midpoint when interpolating in Oklch from a deep brown
+		For example, the midpoint when interpolating in OKLCh from a deep brown
 		 oklch(0.5 0.1 30) to a turquoise
 		 oklch(0.7 0.1 190)
 		would be at a hue angle of (30 + 190) * 0.5 = 110 degrees,
@@ -5197,7 +5197,7 @@ Hue Interpolation
 	the interpolation will not flip to the other arc.
 
 	

-		For example, the midpoint when interpolating in Oklch from a deep brown
+		For example, the midpoint when interpolating in OKLCh from a deep brown
 		 oklch(0.5 0.1 30) to a turquoise
 		 oklch(0.7 0.1 190)
 		would be at a hue angle of (30 + 360 + 190) * 0.5 = 290 degrees,
@@ -5279,13 +5279,13 @@ Clipping
 		the amount of blue light is three times the amount of green,
 		while the amount of red light is half that of green.
 		There is six times as much blue primary as red.
-		In Oklch, this color has a hue angle of 265.1°
+		In OKLCh, this color has a hue angle of 265.1°
 
 		If we now clip this color
 		to bring it into gamut for sRGB,
 		we get color(srgb-linear 0.5 1 1).
 		The amount of blue light is the same as green.
-		In Oklch, this color has a hue angle of 196.1°,
+		In OKLCh, this color has a hue angle of 196.1°,
 		a substantial change of 69°.
 	

 
@@ -5323,7 +5323,7 @@ Chroma Reduction
 	In this example, Display P3 primary yellow
 	(color(display-p3 1 1 0))
 	is being mapped to an sRGB display.
-	The gamut mapping color space is Oklch.
+	The gamut mapping color space is OKLCh.
 
 	
color(display-p3 1 1 0)

 	is
@@ -5344,7 +5344,7 @@ Chroma Reduction
-
A constant-hue slice of Oklch color space. +
A constant-hue slice of OKLCh color space. The vertical axis represents lightness, the horizontal axis is chroma. The color to be mapped, @@ -5397,9 +5397,9 @@ Excessive Chroma Reduction Simple gamut mapping in CIE LCH would give unsatisfactory results. -
+
In this example, Display P3 primary yellow (color(display-p3 1 1 0) - has the chroma progressively reduced, but this time in Oklch color space. + has the chroma progressively reduced, but this time in OKLCh color space.
@@ -5411,7 +5411,7 @@ Excessive Chroma Reduction the Display P3 red, green and blue components.
- It can be seen that reduction in Oklch chroma is better behaved. + It can be seen that reduction in OKLCh chroma is better behaved. Colors do not go outside the Display P3 gamut, and the resulting gamut-mapped yellow has good chroma. Simple gamut mapping in OK LCH would give acceptable results. @@ -5454,9 +5454,9 @@ Chroma Reduction with Local Clipping Gamut mapping in CIE LCH with local clip would give acceptable results.
-
+
In this example, Display P3 primary yellow (color(display-p3 1 1 0) - has the chroma progressively reduced, but this time in Oklch color space + has the chroma progressively reduced, but this time in OKLCh color space and with the local clip modification.
@@ -5469,7 +5469,7 @@ Chroma Reduction with Local Clipping the Display P3 red, green and blue components.
- It can be seen that reduction in Oklch chroma, + It can be seen that reduction in OKLCh chroma, which was already good, is further improved by the local clip modification. Simple gamut mapping in CIE LCH with local clip would give excellent results. @@ -5499,7 +5499,7 @@ Deviations from Perceptual Uniformity: Hue Curvature
- Using Oklch color space + Using OKLCh color space and deltaEOK distance metric avoids this issue at all hue angles. @@ -5507,7 +5507,7 @@ Deviations from Perceptual Uniformity: Hue Curvature
- A constant-hue slice of Oklch color space, + A constant-hue slice of OKLCh color space, at a hue angle of 264.06° corresponding to sRGB primary blue. The vertical axis is Lightness, the horizontal axis is Chroma. @@ -5557,7 +5557,7 @@ CSS Gamut Mapping to an RGB Destination colors inside the destination gamut could be changed. - CSS gamut mapping occurs in the Oklch color space, + CSS gamut mapping occurs in the OKLCh color space, and the color difference formula used is deltaEOK. The local-MINDE improvement is used. @@ -5590,14 +5590,14 @@ CSS Gamut Mapping to an RGB Destination Then return the clipped version of the color as the mapped result. - For the Oklch color space, - one JND is is an Oklch difference of 0.02. + For the OKLCh color space, + one JND is is an OKLCh difference of 0.02. Note: In CIE Lab color space, where the range of the Lightness component is 0 to 100, using deltaE2000, one JND is 2. - Because the range of Lightness in Oklab and Oklch + Because the range of Lightness in Oklab and OKLCh is 0 to 1, using deltaEOK, one JND is 100 times smaller. @@ -5613,21 +5613,21 @@ Sample Pseudocode for the Binary Search Gamut Mapping Algorithm with Local MINDE
    -
  1. if |destination| has no gamut limits (XYZ-D65, XYZ-D50, Lab, LCH, Oklab, Oklch) convert |origin| to |destination| and return it as the gamut mapped color - -
  2. let |origin_Oklch| be |origin| converted - from |origin color space| to the Oklch color space
    3. +
  3. if |destination| has no gamut limits (XYZ-D65, XYZ-D50, Lab, LCH, Oklab, OKLCh) convert |origin| to |destination| and return it as the gamut mapped color + +
  4. let |origin_OKLCh| be |origin| converted + from |origin color space| to the OKLCh color space
    5. -
  5. if the Lightness of |origin_Oklch| is greater than or equal to 100%, +
  6. if the Lightness of |origin_OKLCh| is greater than or equal to 100%, convert `oklab(1 0 0 / origin.alpha)` to |destination| and return it as the gamut mapped color
    7. -
  7. if the Lightness of |origin_Oklch| is less than than or equal to 0%, +
  8. if the Lightness of |origin_OKLCh| is less than than or equal to 0%, convert `oklab(0 0 0 / origin.alpha)` to |destination| and return it as the gamut mapped color
  9. let inGamut(|color|) be a function which returns true if, when passed a color, that color is inside the gamut of |destination|. For HSL and HWB, it returns true if the color is inside the gamut of sRGB.
    10. -
  10. if inGamut(|origin_Oklch|) is true, convert |origin_Oklch| to |destination| and return it as the gamut mapped color
    11. +
  11. if inGamut(|origin_OKLCh|) is true, convert |origin_OKLCh| to |destination| and return it as the gamut mapped color
  12. otherwise, let delta(|one|, |two|) be a function which returns the deltaEOK of color |one| compared to color |two|
  13. let |JND| be 0.02
    14. @@ -5638,7 +5638,7 @@ Sample Pseudocode for the Binary Search Gamut Mapping Algorithm with Local MINDE and returns the result -
  14. set |current| to |origin_Oklch|
    15. +
  15. set |current| to |origin_OKLCh|
  16. set |clipped| to clip(|current|)
  17. set |E| to delta(|clipped|, |current|)
  18. if |E| < |JND| @@ -5649,7 +5649,7 @@ Sample Pseudocode for the Binary Search Gamut Mapping Algorithm with Local MINDE
  19. set |min| to zero
    20. -
  20. set |max| to the Oklch chroma of |origin_Oklch|
    21. +
  21. set |max| to the OKLCh chroma of |origin_OKLCh|
  22. let |min_inGamut| be a boolean that represents when |min| is still in gamut, and set it to true
  23. while (|max| - |min| is greater than |epsilon|) repeat the following steps
      @@ -5855,12 +5855,12 @@ Resolving Lab and LCH values

      -Resolving Oklab and Oklch values

      +Resolving Oklab and OKLCh values This applies to ''oklab()'' and ''oklch()'' values. The declared, computed and used value - is the corresponding Oklab or Oklch color + is the corresponding Oklab or OKLCh color (after clamping of L, C and H) paired with the specified alpha channel (as a <>, not a <>; @@ -6464,7 +6464,7 @@ Serializing Lab and LCH values

      -Serializing Oklab and Oklch values

      +Serializing Oklab and OKLCh values The serialized form of ''oklch()'' and ''oklab()'' values is derived from the [=computed value=] @@ -6476,7 +6476,7 @@ Serializing Oklab and Oklch values the L, a, b and C component values are serialized as <> using the Oklab percentage reference ranges - or the Oklch percentage reference ranges + or the OKLCh percentage reference ranges as appropriate to perform percentage to number conversion; thus 0% L maps to 0 @@ -7224,9 +7224,9 @@ Changes
    1. Dropped the confusing "representing black" and "representing white" comments
    2. Clarified that opponent a and b are analogous
    3. Specified RGB channels using reference ranges rather than prose, for consistency
      4. -
    4. Explicitly referenced percent reference ranges for percentage to number conversion when serializing Lab, LCH, Oklab, Oklch
      5. +
    5. Explicitly referenced percent reference ranges for percentage to number conversion when serializing Lab, LCH, Oklab, OKLCh
    6. Required Oklab interpolation, remove previous "may", describe explicit opt-out
      7. -
    7. Labelled the Lab, LCH, Oklab and Oklch tutorial sections as non-normative. Moved some definitions out of the non-normative section.
      8. +
    8. Labelled the Lab, LCH, Oklab and OKLCh tutorial sections as non-normative. Moved some definitions out of the non-normative section.
    9. Clarified that, when interpolating, checking for analogous components happens before color space conversion
    10. Back-ported hwb() syntax changes and reference ranges from CSS Color 5
    11. Defined carry-forward operations must happen before powerless operations
      12. @@ -7251,7 +7251,7 @@ Changes
    12. Clarified that for color(), three parameters (RGB or XYZ) are required
    13. Clarified serialization of named colors, system colors, and transparent
      14. -
    14. Define specified value for Lab, LCH, Oklab, Oklch
      15. +
    15. Define specified value for Lab, LCH, Oklab, OKLCh
    16. Define specified value for other sRGB colors
    17. Define specified values for named and system colors
    18. Clamp alpha, Lightness, Chroma and Hue at parsed-value time
      19. @@ -7273,7 +7273,7 @@ Changes
    19. Clarified a,b and C,h powerless at L=100% representing white.
    20. Removed handwavy mention of L=400 which applies to hdr-CIELAB not CIE Lab
      21. -
    21. Consistent capitalization of Oklab and Oklch
      22. +
    22. Consistent capitalization of Oklab and OKLCh
    23. Moved definitions of valid color, invalid color, out of gamut and in gamut to terminology section
    24. Fixed definition of "longer" hue interpolation
    25. Further clarified the concept of a host syntax
      26. @@ -7354,11 +7354,11 @@ Changes
        -
      • Added gamut mapping section and defined a CSS gamut mapping algorithm as chroma reduction in Oklch with local MINDE.
        • +
      • Added gamut mapping section and defined a CSS gamut mapping algorithm as chroma reduction in OKLCh with local MINDE.
      • Computed value of color(xyz ...) is color(xyz-d65 ...)
      • Added srgb-linear to interpolation color spaces
      • Updated Changes from Colors 3 section
        • -
      • Added Resolving Oklab and Oklch values section
        • +
      • Added Resolving Oklab and OKLCh values section
      • Added srgb-linear color space
      • Moved @color-profile and device-cmyk to level 5 per CSSWG resolution
        • @@ -7371,9 +7371,9 @@ Changes
      • Removed fallback colors from device-cmyk
      • Host syntax that does not declare a default now uses Oklab by default
      • Added sample code for deltaE OK
        • -
      • Added sample conversion code for OKlab and Oklch
        • +
      • Added sample conversion code for OKlab and OKLCh
      • Added oklab() and oklch() functions
        • - Added description of Oklab and Oklch + Added description of Oklab and OKLCh
      • Added description of CIE LCH deficiencies
      • Allowed all components of a color to be "missing" via the ''none'' keyword, defined when components are "powerless" and automatically become missing in some cases, diff --git a/css-color-5/Overview.bs b/css-color-5/Overview.bs index 1d818cc219c..19804b1fbc1 100644 --- a/css-color-5/Overview.bs +++ b/css-color-5/Overview.bs @@ -1131,7 +1131,7 @@ in the range [0, 360]. } - The value of --bg when converted to Oklch is + The value of --bg when converted to OKLCh is oklch(0.592 0.009 17.42) but the analogous hue component is carried forward giving oklch(0.592 0.009 none). @@ -1530,7 +1530,7 @@ However, unlike HSL, manipulations are not guaranteed to be in-gamut. and the Hue actually changed by 141 degrees, not 120. -

        Relative Oklch Colors

        +

        Relative OKLCh Colors

        The grammar of the ''oklch()'' function is extended as follows: @@ -1548,15 +1548,15 @@ the allowed [=channel keywords=] are: * l is a <> that corresponds to the [=origin color's=] Oklab Lightness - after conversion, if required, to Oklch. + after conversion, if required, to OKLCh. 1.0 is equivalent to 100%. * c is a <> - that corresponds to the [=origin color's=] Oklch chroma - after conversion, if required, to Oklch. + that corresponds to the [=origin color's=] OKLCh chroma + after conversion, if required, to OKLCh. 0.4 is equivalent to 100%. * h is a <> - that corresponds to the [=origin color's=] Oklch hue, in degrees, - after conversion, if required, to Oklch, + that corresponds to the [=origin color's=] OKLCh hue, in degrees, + after conversion, if required, to OKLCh, normalized to a [0, 360] range. 90 is equivalent to 90deg. * alpha is a <> that corresponds to the [=origin color's=] alpha transparency. 1.0 is equivalent to 100%. @@ -1565,17 +1565,17 @@ the allowed [=channel keywords=] are: relative-currentcolor-oklch-01.html - Because Oklch is both perceptually uniform and chroma-preserving, + Because OKLCh is both perceptually uniform and chroma-preserving, and because the axes correspond to easily understood attributes of a color, - Oklch is a good choice for color manipulation. + OKLCh is a good choice for color manipulation.
        In this example, the aim is again to produce a new color with the same Lightness and Chroma, but the triad (hue differs by 120 degrees). -In this example, we will do the manipulation in Oklch. +In this example, we will do the manipulation in OKLCh. The origin color is inside the RGB gamut, -but rotating the hue in Oklch +but rotating the hue in OKLCh again produces an out of gamut color. 
        @@ -1590,9 +1590,9 @@ which is out of sRGB gamut,
 color(srgb -0.6018 0.7621 0.8448)
 as the negative red component indicates.
 Bring this into gamut
-by reducing Oklch Chroma, yields
+by reducing OKLCh Chroma, yields
  oklch(0.69012 0.1173 199.893).
-The Oklch chroma has dropped from 0.251 to 0.117.
+The OKLCh chroma has dropped from 0.251 to 0.117.
        -
      • Consistent capitalization of Oklab and Oklch
        • +
      • Consistent capitalization of Oklab and OKLCh
      • Accessibility improvements for color swatches
      • Accessibility improvements for diagrams
        • @@ -3436,7 +3436,7 @@ This specification adds a way to ensure adequate contrast for text whose backgro
      • Moved @color-profile and device-cmyk to level 5 per CSSWG resolution
      • Excluded none as a component name
        • -
      • Added Oklch relative color syntax example
        • +
      • Added OKLCh relative color syntax example
      • Defined interpolation color space
      • Defined loading color profiles in terms of fetch
      • Clarified that contrast is calculated relative to D65-adapted CIE XYZ