@webref/css 5.4.4 → 6.0.0

package/css-color-5.json

@@ -3,10 +3,11 @@
     "title": "CSS Color Module Level 5",
     "url": "https://drafts.csswg.org/css-color-5/"
   },
-  "properties": {},
-  "atrules": {
-    "@color-profile": {
-      "value": "@color-profile [<dashed-ident> | device-cmyk] { <declaration-list> }",
+  "properties": [],
+  "atrules": [
+    {
+      "name": "@color-profile",
+      "prose": "The @color-profile rule defines and names a color profile which can later be used in the color() function to specify a color.",
       "descriptors": [
         {
           "name": "src",
@@ -18,7 +19,33 @@
           "name": "rendering-intent",
           "for": "@color-profile",
           "value": "relative-colorimetric | absolute-colorimetric | perceptual | saturation",
-          "initial": "relative-colorimetric"
+          "initial": "relative-colorimetric",
+          "values": [
+            {
+              "name": "relative-colorimetric",
+              "prose": "Media-relative colorimetric is required to leave source colors that fall inside the destination medium gamut unchanged relative to the respective media white points. Source colors that are out of the destination medium gamut are mapped to colors on the gamut boundary using a variety of different methods. The media-relative colorimetric rendering intent is often used with black point compensation, where the source medium black point is mapped to the destination medium black point as well. This method must map the source white point to the destination white point. If black point compensation is in use, the source black point must also be mapped to the destination black point. Adaptation algorithms should be used to adjust for the change in white point. Relative relationships of colors inside both source and destination gamuts should be preserved. Relative relationships of colors outside the destination gamut may be changed.",
+              "type": "value",
+              "value": "relative-colorimetric"
+            },
+            {
+              "name": "absolute-colorimetric",
+              "prose": "ICC-absolute colorimetric is required to leave source colors that fall inside the destination medium gamut unchanged relative to the adopted white (a perfect reflecting diffuser). Source colors that are out of the destination medium gamut are mapped to colors on the gamut boundary using a variety of different methods. This method produces the most accurate color matching of in-gamut colors, but will result in highlight clipping if the destination medium white point is lower than the source medium white point. For this reason it is recommended for use only in applications that need exact color matching and where highlight clipping is not a concern. This method MUST disable white point matching and black point matching when converting colors. In general, this option is not recommended except for testing purposes.",
+              "type": "value",
+              "value": "absolute-colorimetric"
+            },
+            {
+              "name": "perceptual",
+              "prose": "This method is often the preferred choice for images, especially when there are substantial differences between the source and destination (such as a screen display image reproduced on a reflection print). It takes the colors of the source image and re-optimizes the appearance for the destination medium using proprietary methods. This re-optimization may result in colors within both the source and destination gamuts being changed, although perceptual transforms are supposed to maintain the basic artistic intent of the original in the reproduction. They will not attempt to correct errors in the source image. This method should maintain relative color values among the pixels as they are mapped to the target device gamut. This method may change pixel values that were originally within the target device gamut, in order to avoid hue shifts and discontinuities and to preserve as much as possible the overall appearance of the scene.",
+              "type": "value",
+              "value": "perceptual"
+            },
+            {
+              "name": "saturation",
+              "prose": "This option was created to preserve the relative saturation (chroma) of the original, and to keep solid colors pure. However, it experienced interoperability problems like the perceptual intent, and as solid color preservation is not amenable to a reference medium solution using v4 profiles does not solve the problem. Use of this rendering intent is not recommended unless the specific source and destination profiles to be used have been checked to ensure the combination produces the desired result. This option should preserve the relative saturation (chroma) values of the original pixels. Out of gamut colors should be converted to colors that have the same saturation but fall just inside the gamut.",
+              "type": "value",
+              "value": "saturation"
+            }
+          ]
         },
         {
           "name": "components",
@@ -26,63 +53,321 @@
           "value": "<ident>#",
           "initial": "n/a"
         }
-      ]
+      ],
+      "value": "@color-profile [<dashed-ident> | device-cmyk] { <declaration-list> }"
     }
-  },
-  "valuespaces": {
-    "<color-mix()>": {
+  ],
+  "selectors": [],
+  "values": [
+    {
+      "name": "color-mix()",
+      "type": "function",
       "value": "color-mix( <color-interpolation-method> , [ <color> && <percentage [0,100]>? ]#{2})"
     },
-    "<rgb()>": {
-      "value": "rgb( [<percentage> | none]{3} [ / [<alpha-value> | none] ]? ) | rgb( [<number> | none]{3} [ / [<alpha-value> | none] ]? ) | rgb( [ from <color> ]? [ <number> | <percentage> | none]{3} [ / [<alpha-value> | none] ]? )"
+    {
+      "name": "rgb()",
+      "type": "function",
+      "value": "rgb( [<percentage> | none]{3} [ / [<alpha-value> | none] ]? ) | rgb( [<number> | none]{3} [ / [<alpha-value> | none] ]? ) | rgb( [ from <color> ]? [ <number> | <percentage> | none]{3} [ / [<alpha-value> | none] ]? )",
+      "values": [
+        {
+          "name": "r",
+          "prose": "r, g, and b are all <percentage>s or <number>s that correspond to the origin color’s red, green, and blue channels after its conversion to sRGB. For <number>s, 255 (or 255.0) is equivalent to 100%.",
+          "type": "value",
+          "value": "r"
+        },
+        {
+          "name": "g",
+          "prose": "r, g, and b are all <percentage>s or <number>s that correspond to the origin color’s red, green, and blue channels after its conversion to sRGB. For <number>s, 255 (or 255.0) is equivalent to 100%.",
+          "type": "value",
+          "value": "g"
+        },
+        {
+          "name": "b",
+          "prose": "r, g, and b are all <percentage>s or <number>s that correspond to the origin color’s red, green, and blue channels after its conversion to sRGB. For <number>s, 255 (or 255.0) is equivalent to 100%.",
+          "type": "value",
+          "value": "b"
+        },
+        {
+          "name": "alpha",
+          "prose": "alpha is a <number> or <percentage> that corresponds to the origin color’s alpha transparency",
+          "type": "value",
+          "value": "alpha"
+        }
+      ]
     },
-    "<alpha-value>": {
+    {
+      "name": "<alpha-value>",
+      "type": "type",
       "value": "<number> | <percentage>"
     },
-    "<hsl()>": {
-      "value": "hsl([from <color>]? [<hue> | none] [<percentage> | <number> | none] [<percentage> | <number> | none] [ / [<alpha-value> | none] ]? )"
+    {
+      "name": "hsl()",
+      "type": "function",
+      "value": "hsl([from <color>]? [<hue> | none] [<percentage> | <number> | none] [<percentage> | <number> | none] [ / [<alpha-value> | none] ]? )",
+      "values": [
+        {
+          "name": "h",
+          "prose": "h is an <angle> that corresponds to the origin color’s HSL hue after its conversion to sRGB, normalized to a [0deg, 360deg) range",
+          "type": "value",
+          "value": "h"
+        },
+        {
+          "name": "s",
+          "prose": "s and l are <percentage>s or <number>s that correspond to the origin color’s HSL saturation and lightness after its conversion to sRGB",
+          "type": "value",
+          "value": "s"
+        },
+        {
+          "name": "l",
+          "prose": "s and l are <percentage>s or <number>s that correspond to the origin color’s HSL saturation and lightness after its conversion to sRGB",
+          "type": "value",
+          "value": "l"
+        },
+        {
+          "name": "alpha",
+          "prose": "alpha is a <number> or <percentage> that corresponds to the origin color’s alpha transparency",
+          "type": "value",
+          "value": "alpha"
+        }
+      ]
     },
-    "<hwb()>": {
-      "value": "hwb([from <color>]? [<hue> | none] [<percentage> | <number> | none] [<percentage> | <number> | none] [ / [<alpha-value> | none] ]? )"
+    {
+      "name": "hwb()",
+      "type": "function",
+      "value": "hwb([from <color>]? [<hue> | none] [<percentage> | <number> | none] [<percentage> | <number> | none] [ / [<alpha-value> | none] ]? )",
+      "values": [
+        {
+          "name": "h",
+          "prose": "h is an <angle> that corresponds to the origin color’s HWB hue after its conversion to sRGB, normalized to a [0deg, 360deg) range",
+          "type": "value",
+          "value": "h"
+        },
+        {
+          "name": "w",
+          "prose": "w and b are <percentage>s or <number>s that correspond to the origin color’s HWB whiteness and blackness after its conversion to sRGB",
+          "type": "value",
+          "value": "w"
+        },
+        {
+          "name": "b",
+          "prose": "w and b are <percentage>s or <number>s that correspond to the origin color’s HWB whiteness and blackness after its conversion to sRGB",
+          "type": "value",
+          "value": "b"
+        },
+        {
+          "name": "alpha",
+          "prose": "alpha is a <number> or <percentage> that corresponds to the origin color’s alpha transparency",
+          "type": "value",
+          "value": "alpha"
+        }
+      ]
     },
-    "<lab()>": {
-      "value": "lab([from <color>]? [<percentage> | <number> | none] [<percentage> | <number> | none] [<percentage> | <number> | none] [ / [<alpha-value> | none] ]? )"
+    {
+      "name": "lab()",
+      "type": "function",
+      "value": "lab([from <color>]? [<percentage> | <number> | none] [<percentage> | <number> | none] [<percentage> | <number> | none] [ / [<alpha-value> | none] ]? )",
+      "values": [
+        {
+          "name": "l",
+          "prose": "l is a <percentage> or <number> that corresponds to the origin color’s CIE Lightness",
+          "type": "value",
+          "value": "l"
+        },
+        {
+          "name": "a",
+          "prose": "a and b are <percentage>s or <number>s that correspond to the origin color’s CIELab a and b axes",
+          "type": "value",
+          "value": "a"
+        },
+        {
+          "name": "b",
+          "prose": "a and b are <percentage>s or <number>s that correspond to the origin color’s CIELab a and b axes",
+          "type": "value",
+          "value": "b"
+        },
+        {
+          "name": "alpha",
+          "prose": "alpha is a <number> or <percentage> that corresponds to the origin color’s alpha transparency",
+          "type": "value",
+          "value": "alpha"
+        }
+      ]
     },
-    "<oklab()>": {
-      "value": "oklab([from <color>]? [<percentage> | <number> | none] [<percentage> | <number> | none] [<percentage> | <number> | none] [ / [<alpha-value> | none] ]? )"
+    {
+      "name": "oklab()",
+      "type": "function",
+      "value": "oklab([from <color>]? [<percentage> | <number> | none] [<percentage> | <number> | none] [<percentage> | <number> | none] [ / [<alpha-value> | none] ]? )",
+      "values": [
+        {
+          "name": "l",
+          "prose": "l is a <percentage> or <number> that corresponds to the origin color’s Oklab Lightness",
+          "type": "value",
+          "value": "l"
+        },
+        {
+          "name": "a",
+          "prose": "a and b are <percentage>s or <number>s that correspond to the origin color’s Oklab a and b axes",
+          "type": "value",
+          "value": "a"
+        },
+        {
+          "name": "b",
+          "prose": "a and b are <percentage>s or <number>s that correspond to the origin color’s Oklab a and b axes",
+          "type": "value",
+          "value": "b"
+        },
+        {
+          "name": "alpha",
+          "prose": "alpha is a <number> or <percentage> that corresponds to the origin color’s alpha transparency",
+          "type": "value",
+          "value": "alpha"
+        }
+      ]
     },
-    "<lch()>": {
-      "value": "lch([from <color>]? [<percentage> | <number> | none] [<percentage> | <number> | none] [<hue> | none] [ / [<alpha-value> | none] ]? )"
+    {
+      "name": "lch()",
+      "type": "function",
+      "value": "lch([from <color>]? [<percentage> | <number> | none] [<percentage> | <number> | none] [<hue> | none] [ / [<alpha-value> | none] ]? )",
+      "values": [
+        {
+          "name": "l",
+          "prose": "l is a <percentage> or <number> that corresponds to the origin color’s CIE Lightness",
+          "type": "value",
+          "value": "l"
+        },
+        {
+          "name": "c",
+          "prose": "c is a <percentage> or <number> that corresponds to the origin color’s LCH chroma",
+          "type": "value",
+          "value": "c"
+        },
+        {
+          "name": "h",
+          "prose": "h is an <angle> that corresponds to the origin color’s LCH hue, normalized to a [0deg, 360deg) range.",
+          "type": "value",
+          "value": "h"
+        },
+        {
+          "name": "alpha",
+          "prose": "alpha is a <number> or <percentage> that corresponds to the origin color’s alpha transparency",
+          "type": "value",
+          "value": "alpha"
+        }
+      ]
     },
-    "<oklch()>": {
-      "value": "oklch([from <color>]? [<percentage> | <number> | none] [<percentage> | <number> | none] [<hue> | none] [ / [<alpha-value> | none] ]? )"
+    {
+      "name": "oklch()",
+      "type": "function",
+      "value": "oklch([from <color>]? [<percentage> | <number> | none] [<percentage> | <number> | none] [<hue> | none] [ / [<alpha-value> | none] ]? )",
+      "values": [
+        {
+          "name": "l",
+          "prose": "l is a <percentage> or <number> that corresponds to the origin color’s Oklab Lightness",
+          "type": "value",
+          "value": "l"
+        },
+        {
+          "name": "c",
+          "prose": "c is a <percentage> or <number> that corresponds to the origin color’s Oklch chroma",
+          "type": "value",
+          "value": "c"
+        },
+        {
+          "name": "h",
+          "prose": "h is an <angle> that corresponds to the origin color’s Oklch hue, normalized to a [0deg, 360deg) range.",
+          "type": "value",
+          "value": "h"
+        },
+        {
+          "name": "alpha",
+          "prose": "alpha is a <number> or <percentage> that corresponds to the origin color’s alpha transparency",
+          "type": "value",
+          "value": "alpha"
+        }
+      ]
     },
-    "<color()>": {
-      "value": "color( [from <color>]? <colorspace-params> [ / [ <alpha-value> | none ] ]? )"
+    {
+      "name": "color()",
+      "type": "function",
+      "value": "color( [from <color>]? <colorspace-params> [ / [ <alpha-value> | none ] ]? )",
+      "values": [
+        {
+          "name": "r",
+          "prose": "r, g, and b are all <percentage>s or <number>s that correspond to the origin color’s red, green, and blue channels after its conversion to the predefined RGB color space.",
+          "type": "value",
+          "value": "r"
+        },
+        {
+          "name": "g",
+          "prose": "r, g, and b are all <percentage>s or <number>s that correspond to the origin color’s red, green, and blue channels after its conversion to the predefined RGB color space.",
+          "type": "value",
+          "value": "g"
+        },
+        {
+          "name": "b",
+          "prose": "r, g, and b are all <percentage>s or <number>s that correspond to the origin color’s red, green, and blue channels after its conversion to the predefined RGB color space.",
+          "type": "value",
+          "value": "b"
+        },
+        {
+          "name": "x",
+          "prose": "x, y, z are all <percentage>s or <number>s that correspond to the origin color’s X, Y and Z channels after its conversion to relative CIE XYZ color space adapted to the relevant white point.",
+          "type": "value",
+          "value": "x"
+        },
+        {
+          "name": "y",
+          "prose": "x, y, z are all <percentage>s or <number>s that correspond to the origin color’s X, Y and Z channels after its conversion to relative CIE XYZ color space adapted to the relevant white point.",
+          "type": "value",
+          "value": "y"
+        },
+        {
+          "name": "z",
+          "prose": "x, y, z are all <percentage>s or <number>s that correspond to the origin color’s X, Y and Z channels after its conversion to relative CIE XYZ color space adapted to the relevant white point.",
+          "type": "value",
+          "value": "z"
+        }
+      ]
     },
-    "<colorspace-params>": {
+    {
+      "name": "<colorspace-params>",
+      "type": "type",
       "value": "[<custom-params> | <predefined-rgb-params> | <xyz-params>]"
     },
-    "<custom-params>": {
+    {
+      "name": "<custom-params>",
+      "type": "type",
       "value": "<dashed-ident> [ <number> | <percentage> | none ]#"
     },
-    "<predefined-rgb-params>": {
+    {
+      "name": "<predefined-rgb-params>",
+      "type": "type",
       "value": "<predefined-rgb> [ <number> | <percentage> | none ]{3}"
     },
-    "<predefined-rgb>": {
+    {
+      "name": "<predefined-rgb>",
+      "type": "type",
       "value": "srgb | srgb-linear | display-p3 | a98-rgb | prophoto-rgb | rec2020"
     },
-    "<xyz-params>": {
+    {
+      "name": "<xyz-params>",
+      "type": "type",
       "value": "<xyz> [ <number> | <percentage> | none ]{3}"
     },
-    "<xyz>": {
+    {
+      "name": "<xyz>",
+      "type": "type",
       "value": "xyz | xyz-d50 | xyz-d65"
     },
-    "<device-cmyk()>": {
+    {
+      "name": "device-cmyk()",
+      "type": "function",
       "value": "device-cmyk( <cmyk-component>{4} [ / <alpha-value> ]? )"
     },
-    "<cmyk-component>": {
+    {
+      "name": "<cmyk-component>",
+      "type": "type",
       "value": "<number> | <percentage>"
     }
-  }
+  ]
 }

package/css-color-adjust.json

@@ -3,8 +3,8 @@
     "title": "CSS Color Adjustment Module Level 1",
     "url": "https://drafts.csswg.org/css-color-adjust-1/"
   },
-  "properties": {
-    "color-scheme": {
+  "properties": [
+    {
       "name": "color-scheme",
       "value": "normal | [ light | dark | <custom-ident> ]+ && only?",
       "initial": "normal",
@@ -14,12 +14,44 @@
       "computedValue": "the keyword normal, or an ordered list of specified color scheme keywords",
       "canonicalOrder": "per grammar",
       "animationType": "discrete",
+      "values": [
+        {
+          "name": "normal",
+          "prose": "Indicates that the element supports the page’s supported color schemes, if they are set, or that it supports no color schemes at all otherwise.",
+          "type": "value",
+          "value": "normal"
+        },
+        {
+          "name": "light",
+          "prose": "Indicates that the element supports a light color scheme.",
+          "type": "value",
+          "value": "light"
+        },
+        {
+          "name": "dark",
+          "prose": "Indicates that the element supports a dark color scheme.",
+          "type": "value",
+          "value": "dark"
+        },
+        {
+          "name": "only",
+          "prose": "Forbids the user agent from overriding the color scheme for the element.",
+          "type": "value",
+          "value": "only"
+        },
+        {
+          "name": "<custom-ident>",
+          "prose": "<custom-ident> values are meaningless, and exist only for future compatibility, so that future added color schemes do not invalidate the color-scheme declaration in legacy user agents. User agents must not interpret any <custom-ident> values as having a meaning; any additional recognized color schemes must be explicitly added to this property’s grammar. The normal, light, dark, and only keywords are not valid <custom-ident>s in this property.",
+          "type": "value",
+          "value": "<custom-ident>"
+        }
+      ],
       "styleDeclaration": [
         "color-scheme",
         "colorScheme"
       ]
     },
-    "forced-color-adjust": {
+    {
       "name": "forced-color-adjust",
       "value": "auto | none | preserve-parent-color",
       "initial": "auto",
@@ -29,12 +61,32 @@
       "computedValue": "as specified",
       "canonicalOrder": "per grammar",
       "animationType": "not animatable",
+      "values": [
+        {
+          "name": "auto",
+          "prose": "The element’s colors are automatically adjusted by the UA in forced colors mode.",
+          "type": "value",
+          "value": "auto"
+        },
+        {
+          "name": "none",
+          "prose": "The element’s colors are not automatically adjusted by the UA in forced colors mode. Authors should only use this value when they are themselves adjusting the colors to support the user’s color and contrast needs and need to make changes to the UA’s default adjustments to provide a more appropriate user experience for those elements.",
+          "type": "value",
+          "value": "none"
+        },
+        {
+          "name": "preserve-parent-color",
+          "prose": "In forced colors mode, if the color property inherits from its parent (i.e. there is no cascaded value or the cascaded value is currentColor, inherit, or another keyword that inherits from the parent), then it computes to the used color of its parent’s color value. In all other respects, behaves the same as none.",
+          "type": "value",
+          "value": "preserve-parent-color"
+        }
+      ],
       "styleDeclaration": [
         "forced-color-adjust",
         "forcedColorAdjust"
       ]
     },
-    "print-color-adjust": {
+    {
       "name": "print-color-adjust",
       "value": "economy | exact",
       "initial": "economy",
@@ -44,12 +96,26 @@
       "computedValue": "specified keyword",
       "canonicalOrder": "per grammar",
       "animationType": "discrete",
+      "values": [
+        {
+          "name": "economy",
+          "prose": "The user agent should make adjustments to the page’s styling as it deems necessary and prudent for the output device. For example, if the document is being printed, a user agent might ignore any backgrounds and adjust text color to be sufficiently dark, to minimize ink usage.",
+          "type": "value",
+          "value": "economy"
+        },
+        {
+          "name": "exact",
+          "prose": "This value indicates that the page is using color and styling on the specified element in a way which is important and significant, and which should not be tweaked or changed except at the user’s request. For example, a mapping website offering printed directions might \"zebra-stripe\" the steps in the directions, alternating between white and light gray backgrounds. Losing this zebra-striping and having a pure-white background would make the directions harder to read with a quick glance when distracted in a car.",
+          "type": "value",
+          "value": "exact"
+        }
+      ],
       "styleDeclaration": [
         "print-color-adjust",
         "printColorAdjust"
       ]
     },
-    "color-adjust": {
+    {
       "name": "color-adjust",
       "value": "<'print-color-adjust'>",
       "initial": "see individual properties",
@@ -64,7 +130,8 @@
         "colorAdjust"
       ]
     }
-  },
-  "atrules": {},
-  "valuespaces": {}
+  ],
+  "atrules": [],
+  "selectors": [],
+  "values": []
 }