mdn-data/css/syntaxes.json

Open Web data by the Mozilla Developer Network

{
  "abs()": {
    "syntax": "abs( <calc-sum> )"
  },
  "absolute-size": {
    "syntax": "xx-small | x-small | small | medium | large | x-large | xx-large | xxx-large"
  },
  "acos()": {
    "syntax": "acos( <calc-sum> )"
  },
  "alpha-value": {
    "syntax": "<number> | <percentage>"
  },
  "an+b": {
    "syntax": "odd | even | <integer> | <n-dimension> | '+'?† n | -n | <ndashdigit-dimension> | '+'?† <ndashdigit-ident> | <dashndashdigit-ident> | <n-dimension> <signed-integer> | '+'?† n <signed-integer> | -n <signed-integer> | <ndash-dimension> <signless-integer> | '+'?† n- <signless-integer> | -n- <signless-integer> | <n-dimension> ['+' | '-'] <signless-integer> | '+'?† n ['+' | '-'] <signless-integer> | -n ['+' | '-'] <signless-integer>"
  },
  "anchor()": {
    "syntax": "anchor( <anchor-name>? && <anchor-side>, <length-percentage>? )"
  },
  "anchor-name": {
    "syntax": "<dashed-ident>"
  },
  "anchor-side": {
    "syntax": "inside | outside | top | left | right | bottom | start | end | self-start | self-end | <percentage> | center"
  },
  "anchor-size": {
    "syntax": "width | height | block | inline | self-block | self-inline"
  },
  "anchor-size()": {
    "syntax": "anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )"
  },
  "angle-percentage": {
    "syntax": "<angle> | <percentage>"
  },
  "angular-color-hint": {
    "syntax": "<angle-percentage> | <zero>"
  },
  "angular-color-stop": {
    "syntax": "<color> <color-stop-angle>?"
  },
  "angular-color-stop-list": {
    "syntax": "<angular-color-stop> , [ <angular-color-hint>? , <angular-color-stop> ]#?"
  },
  "animateable-feature": {
    "syntax": "scroll-position | contents | <custom-ident>"
  },
  "asin()": {
    "syntax": "asin( <calc-sum> )"
  },
  "atan()": {
    "syntax": "atan( <calc-sum> )"
  },
  "atan2()": {
    "syntax": "atan2( <calc-sum>, <calc-sum> )"
  },
  "attachment": {
    "syntax": "scroll | fixed | local"
  },
  "attr()": {
    "syntax": "attr( <attr-name> <type-or-unit>? [, <attr-fallback> ]? )"
  },
  "attr-matcher": {
    "syntax": "[ '~' | '|' | '^' | '$' | '*' ]? '='"
  },
  "attr-modifier": {
    "syntax": "i | s"
  },
  "attribute-selector": {
    "syntax": "'[' <wq-name> ']' | '[' <wq-name> <attr-matcher> [ <string-token> | <ident-token> ] <attr-modifier>? ']'"
  },
  "auto-repeat": {
    "syntax": "repeat( [ auto-fill | auto-fit ] , [ <line-names>? <fixed-size> ]+ <line-names>? )"
  },
  "auto-track-list": {
    "syntax": "[ <line-names>? [ <fixed-size> | <fixed-repeat> ] ]* <line-names>? <auto-repeat>\n[ <line-names>? [ <fixed-size> | <fixed-repeat> ] ]* <line-names>?"
  },
  "axis": {
    "syntax": "block | inline | x | y"
  },
  "baseline-position": {
    "syntax": "[ first | last ]? baseline"
  },
  "basic-shape": {
    "syntax": "<inset()> | <xywh()> | <rect()> | <circle()> | <ellipse()> | <polygon()> | <path()>"
  },
  "basic-shape-rect": {
    "syntax": "<inset()> | <rect()> | <xywh()>"
  },
  "bg-clip": {
    "syntax": "<visual-box> | border-area | text"
  },
  "bg-image": {
    "syntax": "none | <image>"
  },
  "bg-layer": {
    "syntax": "<bg-image> || <bg-position> [ / <bg-size> ]? || <repeat-style> || <attachment> || <visual-box> || <visual-box>"
  },
  "bg-position": {
    "syntax": "[ [ left | center | right | top | bottom | <length-percentage> ] | [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ] | [ center | [ left | right ] <length-percentage>? ] && [ center | [ top | bottom ] <length-percentage>? ] ]"
  },
  "bg-size": {
    "syntax": "[ <length-percentage> | auto ]{1,2} | cover | contain"
  },
  "blend-mode": {
    "syntax": "normal | multiply | screen | overlay | darken | lighten | color-dodge | color-burn | hard-light | soft-light | difference | exclusion | hue | saturation | color | luminosity"
  },
  "blur()": {
    "syntax": "blur( <length>? )"
  },
  "brightness()": {
    "syntax": "brightness( [ <number> | <percentage> ]? )"
  },
  "calc()": {
    "syntax": "calc( <calc-sum> )"
  },
  "calc-constant": {
    "syntax": "e | pi | infinity | -infinity | NaN"
  },
  "calc-product": {
    "syntax": "<calc-value> [ '*' <calc-value> | '/' <number> ]*"
  },
  "calc-size()": {
    "syntax": "calc-size( <calc-size-basis>, <calc-sum> )"
  },
  "calc-size-basis": {
    "syntax": "<intrinsic-size-keyword> | <calc-size()> | any | <calc-sum>"
  },
  "calc-sum": {
    "syntax": "<calc-product> [ [ '+' | '-' ] <calc-product> ]*"
  },
  "calc-value": {
    "syntax": "<number> | <dimension> | <percentage> | <calc-constant> | ( <calc-sum> )"
  },
  "cf-final-image": {
    "syntax": "<image> | <color>"
  },
  "cf-mixing-image": {
    "syntax": "<percentage>? && <image>"
  },
  "circle()": {
    "syntax": "circle( <radial-size>? [ at <position> ]? )"
  },
  "clamp()": {
    "syntax": "clamp( <calc-sum>#{3} )"
  },
  "class-selector": {
    "syntax": "'.' <ident-token>"
  },
  "clip-source": {
    "syntax": "<url>"
  },
  "color": {
    "syntax": "<color-base> | currentColor | <system-color> | <light-dark()> | <deprecated-system-color>"
  },
  "color()": {
    "syntax": "color( [ from <color> ]? <colorspace-params> [ / [ <alpha-value> | none ] ]? )"
  },
  "color-base": {
    "syntax": "<hex-color> | <color-function> | <named-color> | <color-mix()> | transparent"
  },
  "color-function": {
    "syntax": "<rgb()> | <rgba()> | <hsl()> | <hsla()> | <hwb()> | <lab()> | <lch()> | <oklab()> | <oklch()> | <color()>"
  },
  "color-interpolation-method": {
    "syntax": "in [ <rectangular-color-space> | <polar-color-space> <hue-interpolation-method>? | <custom-color-space> ]"
  },
  "color-mix()": {
    "syntax": "color-mix( <color-interpolation-method> , [ <color> && <percentage [0,100]>? ]#{2})"
  },
  "color-stop": {
    "syntax": "<color-stop-length> | <color-stop-angle>"
  },
  "color-stop-angle": {
    "syntax": "[ <angle-percentage> | <zero> ]{1,2}"
  },
  "color-stop-length": {
    "syntax": "<length-percentage>{1,2}"
  },
  "color-stop-list": {
    "syntax": "<linear-color-stop> , [ <linear-color-hint>? , <linear-color-stop> ]#?"
  },
  "colorspace-params": {
    "syntax": "[<custom-params> | <predefined-rgb-params> | <xyz-params>]"
  },
  "combinator": {
    "syntax": "'>' | '+' | '~' | [ '||' ]"
  },
  "common-lig-values": {
    "syntax": "[ common-ligatures | no-common-ligatures ]"
  },
  "compat-auto": {
    "syntax": "searchfield | textarea | push-button | slider-horizontal | checkbox | radio | square-button | menulist | listbox | meter | progress-bar | button"
  },
  "complex-selector": {
    "syntax": "<compound-selector> [ <combinator>? <compound-selector> ]*"
  },
  "complex-selector-list": {
    "syntax": "<complex-selector>#"
  },
  "composite-style": {
    "syntax": "clear | copy | source-over | source-in | source-out | source-atop | destination-over | destination-in | destination-out | destination-atop | xor"
  },
  "compositing-operator": {
    "syntax": "add | subtract | intersect | exclude"
  },
  "compound-selector": {
    "syntax": "[ <type-selector>? <subclass-selector>* [ <pseudo-element-selector> <pseudo-class-selector>* ]* ]!"
  },
  "compound-selector-list": {
    "syntax": "<compound-selector>#"
  },
  "conic-gradient()": {
    "syntax": "conic-gradient( [ <conic-gradient-syntax> ] )"
  },
  "conic-gradient-syntax": {
    "syntax": "[ [ [ from [ <angle> | <zero> ] ]? [ at <position> ]? ] || <color-interpolation-method> ]? , <angular-color-stop-list>"
  },
  "container-condition": {
    "syntax": "[ <container-name>? <container-query>? ]!"
  },
  "container-name": {
    "syntax": "<custom-ident>"
  },
  "container-query": {
    "syntax": "not <query-in-parens> | <query-in-parens> [ [ and <query-in-parens> ]* | [ or <query-in-parens> ]* ]"
  },
  "content-distribution": {
    "syntax": "space-between | space-around | space-evenly | stretch"
  },
  "content-list": {
    "syntax": "[ <string> | contents | <image> | <counter> | <quote> | <target> | <leader()> ]+"
  },
  "content-position": {
    "syntax": "center | start | end | flex-start | flex-end"
  },
  "content-replacement": {
    "syntax": "<image>"
  },
  "contextual-alt-values": {
    "syntax": "[ contextual | no-contextual ]"
  },
  "contrast()": {
    "syntax": "contrast( [ <number> | <percentage> ]? )"
  },
  "coord-box": {
    "syntax": "<paint-box> | view-box"
  },
  "cos()": {
    "syntax": "cos( <calc-sum> )"
  },
  "counter": {
    "syntax": "<counter()> | <counters()>"
  },
  "counter()": {
    "syntax": "counter( <counter-name>, <counter-style>? )"
  },
  "counter-name": {
    "syntax": "<custom-ident>"
  },
  "counter-style": {
    "syntax": "<counter-style-name> | symbols()"
  },
  "counter-style-name": {
    "syntax": "<custom-ident>"
  },
  "counters()": {
    "syntax": "counters( <counter-name>, <string>, <counter-style>? )"
  },
  "cross-fade()": {
    "syntax": "cross-fade( <cf-mixing-image> , <cf-final-image>? )"
  },
  "cubic-bezier()": {
    "syntax": "cubic-bezier( [ <number [0,1]>, <number> ]#{2} )"
  },
  "cubic-bezier-timing-function": {
    "syntax": "ease | ease-in | ease-out | ease-in-out | <cubic-bezier()>"
  },
  "custom-color-space": {
    "syntax": "<dashed-ident>"
  },
  "custom-params": {
    "syntax": "<dashed-ident> [ <number> | <percentage> | none ]+"
  },
  "dasharray": {
    "syntax": "[ [ <length-percentage> | <number> ]+ ]#"
  },
  "dashndashdigit-ident": {
    "syntax": "<ident-token>"
  },
  "deprecated-system-color": {
    "syntax": "ActiveBorder | ActiveCaption | AppWorkspace | Background | ButtonHighlight | ButtonShadow | CaptionText | InactiveBorder | InactiveCaption | InactiveCaptionText | InfoBackground | InfoText | Menu | MenuText | Scrollbar | ThreeDDarkShadow | ThreeDFace | ThreeDHighlight | ThreeDLightShadow | ThreeDShadow | Window | WindowFrame | WindowText"
  },
  "discretionary-lig-values": {
    "syntax": "[ discretionary-ligatures | no-discretionary-ligatures ]"
  },
  "display-box": {
    "syntax": "contents | none"
  },
  "display-inside": {
    "syntax": "flow | flow-root | table | flex | grid | ruby"
  },
  "display-internal": {
    "syntax": "table-row-group | table-header-group | table-footer-group | table-row | table-cell | table-column-group | table-column | table-caption | ruby-base | ruby-text | ruby-base-container | ruby-text-container"
  },
  "display-legacy": {
    "syntax": "inline-block | inline-list-item | inline-table | inline-flex | inline-grid"
  },
  "display-listitem": {
    "syntax": "<display-outside>? && [ flow | flow-root ]? && list-item"
  },
  "display-outside": {
    "syntax": "block | inline | run-in"
  },
  "drop-shadow()": {
    "syntax": "drop-shadow( [ <color>? && <length>{2,3} ] )"
  },
  "easing-function": {
    "syntax": "<linear-easing-function> | <cubic-bezier-easing-function> | <step-easing-function>"
  },
  "east-asian-variant-values": {
    "syntax": "[ jis78 | jis83 | jis90 | jis04 | simplified | traditional ]"
  },
  "east-asian-width-values": {
    "syntax": "[ full-width | proportional-width ]"
  },
  "element()": {
    "syntax": "element( <id-selector> )"
  },
  "ellipse()": {
    "syntax": "ellipse( <radial-size>? [ at <position> ]? )"
  },
  "env()": {
    "syntax": "env( <custom-ident> , <declaration-value>? )"
  },
  "exp()": {
    "syntax": "exp( <calc-sum> )"
  },
  "explicit-track-list": {
    "syntax": "[ <line-names>? <track-size> ]+ <line-names>?"
  },
  "family-name": {
    "syntax": "<string> | <custom-ident>+"
  },
  "feature-tag-value": {
    "syntax": "<string> [ <integer> | on | off ]?"
  },
  "feature-type": {
    "syntax": "@stylistic | @historical-forms | @styleset | @character-variant | @swash | @ornaments | @annotation"
  },
  "feature-value-block": {
    "syntax": "<feature-type> '{' <feature-value-declaration-list> '}'"
  },
  "feature-value-block-list": {
    "syntax": "<feature-value-block>+"
  },
  "feature-value-declaration": {
    "syntax": "<custom-ident>: <integer>+;"
  },
  "feature-value-declaration-list": {
    "syntax": "<feature-value-declaration>"
  },
  "feature-value-name": {
    "syntax": "<custom-ident>"
  },
  "filter-function": {
    "syntax": "<blur()> | <brightness()> | <contrast()> | <drop-shadow()> | <grayscale()> | <hue-rotate()> | <invert()> | <opacity()> | <saturate()> | <sepia()>"
  },
  "filter-value-list": {
    "syntax": "[ <filter-function> | <url> ]+"
  },
  "final-bg-layer": {
    "syntax": "<'background-color'> || <bg-image> || <bg-position> [ / <bg-size> ]? || <repeat-style> || <attachment> || <visual-box> || <visual-box>"
  },
  "fit-content()": {
    "syntax": "fit-content( <length-percentage [0,∞]> )"
  },
  "fixed-breadth": {
    "syntax": "<length-percentage>"
  },
  "fixed-repeat": {
    "syntax": "repeat( [ <integer [1,∞]> ] , [ <line-names>? <fixed-size> ]+ <line-names>? )"
  },
  "fixed-size": {
    "syntax": "<fixed-breadth> | minmax( <fixed-breadth> , <track-breadth> ) | minmax( <inflexible-breadth> , <fixed-breadth> )"
  },
  "font-stretch-absolute": {
    "syntax": "normal | ultra-condensed | extra-condensed | condensed | semi-condensed | semi-expanded | expanded | extra-expanded | ultra-expanded | <percentage>"
  },
  "font-variant-css21": {
    "syntax": "[ normal | small-caps ]"
  },
  "font-weight-absolute": {
    "syntax": "normal | bold | <number [1,1000]>"
  },
  "form-control-identifier": {
    "syntax": "select"
  },
  "frequency-percentage": {
    "syntax": "<frequency> | <percentage>"
  },
  "generic-complete": {
    "syntax": "serif | sans-serif | system-ui | cursive | fantasy | math | monospace"
  },
  "general-enclosed": {
    "syntax": "[ <function-token> <any-value> ) ] | ( <ident> <any-value> )"
  },
  "generic-family": {
    "syntax": "<generic-complete> | <generic-incomplete> | emoji | fangsong"
  },
  "generic-incomplete": {
    "syntax": "ui-serif | ui-sans-serif | ui-monospace | ui-rounded"
  },
  "geometry-box": {
    "syntax": "<shape-box> | fill-box | stroke-box | view-box"
  },
  "gradient": {
    "syntax": "<linear-gradient()> | <repeating-linear-gradient()> | <radial-gradient()> | <repeating-radial-gradient()> | <conic-gradient()> | <repeating-conic-gradient()>"
  },
  "grayscale()": {
    "syntax": "grayscale( [ <number> | <percentage> ]? )"
  },
  "grid-line": {
    "syntax": "auto | <custom-ident> | [ <integer> && <custom-ident>? ] | [ span && [ <integer> || <custom-ident> ] ]"
  },
  "historical-lig-values": {
    "syntax": "[ historical-ligatures | no-historical-ligatures ]"
  },
  "hsl()": {
    "syntax": "hsl( <hue>, <percentage>, <percentage>, <alpha-value>? ) | hsl( [ <hue> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? )"
  },
  "hsla()": {
    "syntax": "hsla( <hue>, <percentage>, <percentage>, <alpha-value>? ) | hsla( [ <hue> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? )"
  },
  "hue": {
    "syntax": "<number> | <angle>"
  },
  "hue-interpolation-method": {
    "syntax": "[ shorter | longer | increasing | decreasing ] hue"
  },
  "hue-rotate()": {
    "syntax": "hue-rotate( [ <angle> | <zero> ]? )"
  },
  "hwb()": {
    "syntax": "hwb( [ <hue> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? )"
  },
  "hypot()": {
    "syntax": "hypot( <calc-sum># )"
  },
  "id-selector": {
    "syntax": "<hash-token>"
  },
  "image": {
    "syntax": "<url> | <image()> | <image-set()> | <element()> | <paint()> | <cross-fade()> | <gradient>"
  },
  "image()": {
    "syntax": "image( <image-tags>? [ <image-src>? , <color>? ]! )"
  },
  "image-set()": {
    "syntax": "image-set( <image-set-option># )"
  },
  "image-set-option": {
    "syntax": "[ <image> | <string> ] [ <resolution> || type(<string>) ]"
  },
  "image-src": {
    "syntax": "<url> | <string>"
  },
  "image-tags": {
    "syntax": "ltr | rtl"
  },
  "inflexible-breadth": {
    "syntax": "<length-percentage> | min-content | max-content | auto"
  },
  "inset()": {
    "syntax": "inset( <length-percentage>{1,4} [ round <'border-radius'> ]? )"
  },
  "integer": {
    "syntax": "<number-token>"
  },
  "invert()": {
    "syntax": "invert( [ <number> | <percentage> ]? )"
  },
  "keyframe-block": {
    "syntax": "<keyframe-selector># {\n  <declaration-list>\n}"
  },
  "keyframe-selector": {
    "syntax": "from | to | <percentage [0,100]> | <timeline-range-name> <percentage>"
  },
  "keyframes-name": {
    "syntax": "<custom-ident> | <string>"
  },
  "lab()": {
    "syntax": "lab( [<percentage> | <number> | none] [ <percentage> | <number> | none] [ <percentage> | <number> | none] [ / [<alpha-value> | none] ]? )"
  },
  "layer()": {
    "syntax": "layer( <layer-name> )"
  },
  "layer-name": {
    "syntax": "<ident> [ '.' <ident> ]*"
  },
  "lch()": {
    "syntax": "lch( [<percentage> | <number> | none] [ <percentage> | <number> | none] [ <hue> | none] [ / [<alpha-value> | none] ]? )"
  },
  "leader()": {
    "syntax": "leader( <leader-type> )"
  },
  "leader-type": {
    "syntax": "dotted | solid | space | <string>"
  },
  "length-percentage": {
    "syntax": "<length> | <percentage>"
  },
  "light-dark()": {
    "syntax": "light-dark( <color>, <color> )"
  },
  "line-name-list": {
    "syntax": "[ <line-names> | <name-repeat> ]+"
  },
  "line-names": {
    "syntax": "'[' <custom-ident>* ']'"
  },
  "line-style": {
    "syntax": "none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset"
  },
  "line-width": {
    "syntax": "<length> | thin | medium | thick"
  },
  "linear()": {
    "syntax": "linear( [ <number> && <percentage>{0,2} ]# )"
  },
  "linear-color-hint": {
    "syntax": "<length-percentage>"
  },
  "linear-color-stop": {
    "syntax": "<color> <color-stop-length>?"
  },
  "linear-easing-function": {
    "syntax": "linear | <linear()>"
  },
  "linear-gradient()": {
    "syntax": "linear-gradient( [ <linear-gradient-syntax> ] )"
  },
  "linear-gradient-syntax": {
    "syntax": "[ [ <angle> | <zero> | to <side-or-corner> ] || <color-interpolation-method> ]? , <color-stop-list>"
  },
  "log()": {
    "syntax": "log( <calc-sum>, <calc-sum>? )"
  },
  "mask-layer": {
    "syntax": "<mask-reference> || <position> [ / <bg-size> ]? || <repeat-style> || <geometry-box> || [ <geometry-box> | no-clip ] || <compositing-operator> || <masking-mode>"
  },
  "mask-position": {
    "syntax": "[ <length-percentage> | left | center | right ] [ <length-percentage> | top | center | bottom ]?"
  },
  "mask-reference": {
    "syntax": "none | <image> | <mask-source>"
  },
  "mask-source": {
    "syntax": "<url>"
  },
  "masking-mode": {
    "syntax": "alpha | luminance | match-source"
  },
  "matrix()": {
    "syntax": "matrix( <number>#{6} )"
  },
  "matrix3d()": {
    "syntax": "matrix3d( <number>#{16} )"
  },
  "max()": {
    "syntax": "max( <calc-sum># )"
  },
  "media-and": {
    "syntax": "<media-in-parens> [ and <media-in-parens> ]+"
  },
  "media-condition": {
    "syntax": "<media-not> | <media-and> | <media-or> | <media-in-parens>"
  },
  "media-condition-without-or": {
    "syntax": "<media-not> | <media-and> | <media-in-parens>"
  },
  "media-feature": {
    "syntax": "( [ <mf-plain> | <mf-boolean> | <mf-range> ] )"
  },
  "media-in-parens": {
    "syntax": "( <media-condition> ) | <media-feature> | <general-enclosed>"
  },
  "media-not": {
    "syntax": "not <media-in-parens>"
  },
  "media-or": {
    "syntax": "<media-in-parens> [ or <media-in-parens> ]+"
  },
  "media-query": {
    "syntax": "<media-condition> | [ not | only ]? <media-type> [ and <media-condition-without-or> ]?"
  },
  "media-query-list": {
    "syntax": "<media-query>#"
  },
  "media-type": {
    "syntax": "<ident>"
  },
  "mf-boolean": {
    "syntax": "<mf-name>"
  },
  "mf-name": {
    "syntax": "<ident>"
  },
  "mf-plain": {
    "syntax": "<mf-name> : <mf-value>"
  },
  "mf-range": {
    "syntax": "<mf-name> [ '<' | '>' ]? '='? <mf-value>\n| <mf-value> [ '<' | '>' ]? '='? <mf-name>\n| <mf-value> '<' '='? <mf-name> '<' '='? <mf-value>\n| <mf-value> '>' '='? <mf-name> '>' '='? <mf-value>"
  },
  "mf-value": {
    "syntax": "<number> | <dimension> | <ident> | <ratio>"
  },
  "min()": {
    "syntax": "min( <calc-sum># )"
  },
  "minmax()": {
    "syntax": "minmax( [ <length-percentage> | min-content | max-content | auto ] , [ <length-percentage> | <flex> | min-content | max-content | auto ] )"
  },
  "mod()": {
    "syntax": "mod( <calc-sum>, <calc-sum> )"
  },
  "n-dimension": {
    "syntax": "<dimension-token>"
  },
  "name-repeat": {
    "syntax": "repeat( [ <integer [1,∞]> | auto-fill ], <line-names>+ )"
  },
  "named-color": {
    "syntax": "aliceblue | antiquewhite | aqua | aquamarine | azure | beige | bisque | black | blanchedalmond | blue | blueviolet | brown | burlywood | cadetblue | chartreuse | chocolate | coral | cornflowerblue | cornsilk | crimson | cyan | darkblue | darkcyan | darkgoldenrod | darkgray | darkgreen | darkgrey | darkkhaki | darkmagenta | darkolivegreen | darkorange | darkorchid | darkred | darksalmon | darkseagreen | darkslateblue | darkslategray | darkslategrey | darkturquoise | darkviolet | deeppink | deepskyblue | dimgray | dimgrey | dodgerblue | firebrick | floralwhite | forestgreen | fuchsia | gainsboro | ghostwhite | gold | goldenrod | gray | green | greenyellow | grey | honeydew | hotpink | indianred | indigo | ivory | khaki | lavender | lavenderblush | lawngreen | lemonchiffon | lightblue | lightcoral | lightcyan | lightgoldenrodyellow | lightgray | lightgreen | lightgrey | lightpink | lightsalmon | lightseagreen | lightskyblue | lightslategray | lightslategrey | lightsteelblue | lightyellow | lime | limegreen | linen | magenta | maroon | mediumaquamarine | mediumblue | mediumorchid | mediumpurple | mediumseagreen | mediumslateblue | mediumspringgreen | mediumturquoise | mediumvioletred | midnightblue | mintcream | mistyrose | moccasin | navajowhite | navy | oldlace | olive | olivedrab | orange | orangered | orchid | palegoldenrod | palegreen | paleturquoise | palevioletred | papayawhip | peachpuff | peru | pink | plum | powderblue | purple | rebeccapurple | red | rosybrown | royalblue | saddlebrown | salmon | sandybrown | seagreen | seashell | sienna | silver | skyblue | slateblue | slategray | slategrey | snow | springgreen | steelblue | tan | teal | thistle | tomato | turquoise | violet | wheat | white | whitesmoke | yellow | yellowgreen"
  },
  "namespace-prefix": {
    "syntax": "<ident>"
  },
  "ndash-dimension": {
    "syntax": "<dimension-token>"
  },
  "ndashdigit-dimension": {
    "syntax": "<dimension-token>"
  },
  "ndashdigit-ident": {
    "syntax": "<ident-token>"
  },
  "ns-prefix": {
    "syntax": "[ <ident-token> | '*' ]? '|'"
  },
  "number-percentage": {
    "syntax": "<number> | <percentage>"
  },
  "numeric-figure-values": {
    "syntax": "[ lining-nums | oldstyle-nums ]"
  },
  "numeric-fraction-values": {
    "syntax": "[ diagonal-fractions | stacked-fractions ]"
  },
  "numeric-spacing-values": {
    "syntax": "[ proportional-nums | tabular-nums ]"
  },
  "offset-path": {
    "syntax": "<ray()> | <url> | <basic-shape>"
  },
  "oklab()": {
    "syntax": "oklab( [ <percentage> | <number> | none] [ <percentage> | <number> | none] [ <percentage> | <number> | none] [ / [<alpha-value> | none] ]? )"
  },
  "oklch()": {
    "syntax": "oklch( [ <percentage> | <number> | none] [ <percentage> | <number> | none] [ <hue> | none] [ / [<alpha-value> | none] ]? )"
  },
  "opacity()": {
    "syntax": "opacity( [ <number> | <percentage> ]? )"
  },
  "opacity-value": {
    "syntax": "<number> | <percentage>"
  },
  "outline-line-style": {
    "syntax": "none | dotted | dashed | solid | double | groove | ridge | inset | outset"
  },
  "outline-radius": {
    "syntax": "<length> | <percentage>"
  },
  "overflow-position": {
    "syntax": "unsafe | safe"
  },
  "page-body": {
    "syntax": "<declaration>? [ ; <page-body> ]? | <page-margin-box> <page-body>"
  },
  "page-margin-box": {
    "syntax": "<page-margin-box-type> '{' <declaration-list> '}'"
  },
  "page-margin-box-type": {
    "syntax": "@top-left-corner | @top-left | @top-center | @top-right | @top-right-corner | @bottom-left-corner | @bottom-left | @bottom-center | @bottom-right | @bottom-right-corner | @left-top | @left-middle | @left-bottom | @right-top | @right-middle | @right-bottom"
  },
  "page-selector": {
    "syntax": "<pseudo-page>+ | <ident> <pseudo-page>*"
  },
  "page-selector-list": {
    "syntax": "[ <page-selector># ]?"
  },
  "page-size": {
    "syntax": "A5 | A4 | A3 | B5 | B4 | JIS-B5 | JIS-B4 | letter | legal | ledger"
  },
  "paint": {
    "syntax": "none | <color> | <url> [none | <color>]? | context-fill | context-stroke"
  },
  "paint()": {
    "syntax": "paint( <ident>, <declaration-value>? )"
  },
  "paint-box": {
    "syntax": "<visual-box> | fill-box | stroke-box"
  },
  "palette-identifier": {
    "syntax": "<dashed-ident>"
  },
  "palette-mix()": {
    "syntax": "palette-mix(<color-interpolation-method> , [ [normal | light | dark | <palette-identifier> | <palette-mix()> ] && <percentage [0,100]>? ]#{2})"
  },
  "path()": {
    "syntax": "path( <'fill-rule'>? , <string> )"
  },
  "perspective()": {
    "syntax": "perspective( [ <length [0,∞]> | none ] )"
  },
  "polar-color-space": {
    "syntax": "hsl | hwb | lch | oklch"
  },
  "polygon()": {
    "syntax": "polygon( <'fill-rule'>? , [ <length-percentage> <length-percentage> ]# )"
  },
  "position": {
    "syntax": "[ [ left | center | right ] || [ top | center | bottom ] | [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ]? | [ [ left | right ] <length-percentage> ] && [ [ top | bottom ] <length-percentage> ] ]"
  },
  "position-area": {
    "syntax": "[ left | center | right | span-left | span-right | x-start | x-end | span-x-start | span-x-end | x-self-start | x-self-end | span-x-self-start | span-x-self-end | span-all ] || [ top | center | bottom | span-top | span-bottom | y-start | y-end | span-y-start | span-y-end | y-self-start | y-self-end | span-y-self-start | span-y-self-end | span-all ] | [ block-start | center | block-end | span-block-start | span-block-end | span-all ] || [ inline-start | center | inline-end | span-inline-start | span-inline-end | span-all ] | [ self-block-start | center | self-block-end | span-self-block-start | span-self-block-end | span-all ] || [ self-inline-start | center | self-inline-end | span-self-inline-start | span-self-inline-end | span-all ] | [ start | center | end | span-start | span-end | span-all ]{1,2} | [ self-start | center | self-end | span-self-start | span-self-end | span-all ]{1,2}"
  },
  "pow()": {
    "syntax": "pow( <calc-sum>, <calc-sum> )"
  },
  "predefined-rgb": {
    "syntax": "srgb | srgb-linear | display-p3 | a98-rgb | prophoto-rgb | rec2020"
  },
  "predefined-rgb-params": {
    "syntax": "<predefined-rgb> [ <number> | <percentage> | none ]{3}"
  },
  "pseudo-class-selector": {
    "syntax": "':' <ident-token> | ':' <function-token> <any-value> ')'"
  },
  "pseudo-element-selector": {
    "syntax": "':' <pseudo-class-selector>"
  },
  "pseudo-page": {
    "syntax": ": [ left | right | first | blank ]"
  },
  "query-in-parens": {
    "syntax": "( <container-query> ) | ( <size-feature> ) | style( <style-query> ) | scroll-state( <scroll-state-query> ) | <general-enclosed>"
  },
  "quote": {
    "syntax": "open-quote | close-quote | no-open-quote | no-close-quote"
  },
  "radial-extent": {
    "syntax": "closest-corner | closest-side | farthest-corner | farthest-side"
  },
  "radial-gradient()": {
    "syntax": "radial-gradient( [ <radial-gradient-syntax> ] )"
  },
  "radial-gradient-syntax": {
    "syntax": "[ [ [ <radial-shape> || <radial-size> ]? [ at <position> ]? ] || <color-interpolation-method> ]? , <color-stop-list>"
  },
  "radial-shape": {
    "syntax": "circle | ellipse"
  },
  "radial-size": {
    "syntax": "<radial-extent> | <length [0,∞]> | <length-percentage [0,∞]>{2}"
  },
  "ratio": {
    "syntax": "<number [0,∞]> [ / <number [0,∞]> ]?"
  },
  "ray()": {
    "syntax": "ray( <angle> && <ray-size>? && contain? && [at <position>]? )"
  },
  "ray-size": {
    "syntax": "closest-side | closest-corner | farthest-side | farthest-corner | sides"
  },
  "rect()": {
    "syntax": "rect( [ <length-percentage> | auto ]{4} [ round <'border-radius'> ]? )"
  },
  "rectangular-color-space": {
    "syntax": "srgb | srgb-linear | display-p3 | a98-rgb | prophoto-rgb | rec2020 | lab | oklab | xyz | xyz-d50 | xyz-d65"
  },
  "relative-selector": {
    "syntax": "<combinator>? <complex-selector>"
  },
  "relative-selector-list": {
    "syntax": "<relative-selector>#"
  },
  "relative-size": {
    "syntax": "larger | smaller"
  },
  "rem()": {
    "syntax": "rem( <calc-sum>, <calc-sum> )"
  },
  "repeat-style": {
    "syntax": "repeat-x | repeat-y | [ repeat | space | round | no-repeat ]{1,2}"
  },
  "repeating-conic-gradient()": {
    "syntax": "repeating-conic-gradient( [ <conic-gradient-syntax> ] )"
  },
  "repeating-linear-gradient()": {
    "syntax": "repeating-linear-gradient( [ <linear-gradient-syntax> ] )"
  },
  "repeating-radial-gradient()": {
    "syntax": "repeating-radial-gradient( [ <radial-gradient-syntax> ] )"
  },
  "reversed-counter-name": {
    "syntax": "reversed( <counter-name> )"
  },
  "rgb()": {
    "syntax": "rgb( <percentage>#{3} , <alpha-value>? ) | rgb( <number>#{3} , <alpha-value>? ) | rgb( [ <number> | <percentage> | none ]{3} [ / [ <alpha-value> | none ] ]? )"
  },
  "rgba()": {
    "syntax": "rgba( <percentage>#{3} , <alpha-value>? ) | rgba( <number>#{3} , <alpha-value>? ) | rgba( [ <number> | <percentage> | none ]{3} [ / [ <alpha-value> | none ] ]? )"
  },
  "rotate()": {
    "syntax": "rotate( [ <angle> | <zero> ] )"
  },
  "rotate3d()": {
    "syntax": "rotate3d( <number> , <number> , <number> , [ <angle> | <zero> ] )"
  },
  "rotateX()": {
    "syntax": "rotateX( [ <angle> | <zero> ] )"
  },
  "rotateY()": {
    "syntax": "rotateY( [ <angle> | <zero> ] )"
  },
  "rotateZ()": {
    "syntax": "rotateZ( [ <angle> | <zero> ] )"
  },
  "round()": {
    "syntax": "round( <rounding-strategy>?, <calc-sum>, <calc-sum> )"
  },
  "rounding-strategy": {
    "syntax": "nearest | up | down | to-zero"
  },
  "saturate()": {
    "syntax": "saturate( [ <number> | <percentage> ]? )"
  },
  "scale()": {
    "syntax": "scale( [ <number> | <percentage> ]#{1,2} )"
  },
  "scale3d()": {
    "syntax": "scale3d( [ <number> | <percentage> ]#{3} )"
  },
  "scaleX()": {
    "syntax": "scaleX( [ <number> | <percentage> ] )"
  },
  "scaleY()": {
    "syntax": "scaleY( [ <number> | <percentage> ] )"
  },
  "scaleZ()": {
    "syntax": "scaleZ( [ <number> | <percentage> ] )"
  },
  "scope-end": {
    "syntax": "<selector-list>"
  },
  "scope-start": {
    "syntax": "<selector-list>"
  },
  "scroll()": {
    "syntax": "scroll( [ <scroller> || <axis> ]? )"
  },
  "scroller": {
    "syntax": "root | nearest | self"
  },
  "scroll-state-feature": {
    "syntax": "<media-query-list>"
  },
  "scroll-state-in-parens": {
    "syntax": "( <scroll-state-query> ) | ( <scroll-state-feature> ) | <general-enclosed>"
  },
  "scroll-state-query": {
    "syntax": "not <scroll-state-in-parens> | <scroll-state-in-parens> [ [ and <scroll-state-in-parens> ]* | [ or <scroll-state-in-parens> ]* ] | <scroll-state-feature>  "
  },
  "selector-list": {
    "syntax": "<complex-selector-list>"
  },
  "self-position": {
    "syntax": "center | start | end | self-start | self-end | flex-start | flex-end"
  },
  "sepia()": {
    "syntax": "sepia( [ <number> | <percentage> ]? )"
  },
  "shadow": {
    "syntax": "inset? && <length>{2,4} && <color>?"
  },
  "shadow-t": {
    "syntax": "[ <length>{2,3} && <color>? ]"
  },
  "shape": {
    "syntax": "rect(<top>, <right>, <bottom>, <left>)"
  },
  "shape-box": {
    "syntax": "<visual-box> | margin-box"
  },
  "side-or-corner": {
    "syntax": "[ left | right ] || [ top | bottom ]"
  },
  "sign()": {
    "syntax": "sign( <calc-sum> )"
  },
  "signed-integer": {
    "syntax": "<number-token>"
  },
  "signless-integer": {
    "syntax": "<number-token>"
  },
  "sin()": {
    "syntax": "sin( <calc-sum> )"
  },
  "single-animation": {
    "syntax": "<'animation-duration'> || <easing-function> || <'animation-delay'> || <single-animation-iteration-count> || <single-animation-direction> || <single-animation-fill-mode> || <single-animation-play-state> || [ none | <keyframes-name> ] || <single-animation-timeline>"
  },
  "single-animation-composition": {
    "syntax": "replace | add | accumulate"
  },
  "single-animation-direction": {
    "syntax": "normal | reverse | alternate | alternate-reverse"
  },
  "single-animation-fill-mode": {
    "syntax": "none | forwards | backwards | both"
  },
  "single-animation-iteration-count": {
    "syntax": "infinite | <number>"
  },
  "single-animation-play-state": {
    "syntax": "running | paused"
  },
  "single-animation-timeline": {
    "syntax": "auto | none | <dashed-ident> | <scroll()> | <view()>"
  },
  "single-transition": {
    "syntax": "[ none | <single-transition-property> ] || <time> || <easing-function> || <time> || <transition-behavior-value>"
  },
  "single-transition-property": {
    "syntax": "all | <custom-ident>"
  },
  "size": {
    "syntax": "closest-side | farthest-side | closest-corner | farthest-corner | <length> | <length-percentage>{2}"
  },
  "size-feature": {
    "syntax": "<media-query-list>"
  },
  "skew()": {
    "syntax": "skew( [ <angle> | <zero> ] , [ <angle> | <zero> ]? )"
  },
  "skewX()": {
    "syntax": "skewX( [ <angle> | <zero> ] )"
  },
  "skewY()": {
    "syntax": "skewY( [ <angle> | <zero> ] )"
  },
  "sqrt()": {
    "syntax": "sqrt( <calc-sum> )"
  },
  "step-position": {
    "syntax": "jump-start | jump-end | jump-none | jump-both | start | end"
  },
  "step-easing-function": {
    "syntax": "step-start | step-end | <steps()>"
  },
  "steps()": {
    "syntax": "steps( <integer>, <step-position>? )"
  },
  "style-feature": {
    "syntax": "<declaration>"
  },
  "style-in-parens": {
    "syntax": "( <style-query> ) | ( <style-feature> ) | <general-enclosed>"
  },
  "style-query": {
    "syntax": "not <style-in-parens> | <style-in-parens> [ [ and <style-in-parens> ]* | [ or <style-in-parens> ]* ] | <style-feature> "
  },
  "subclass-selector": {
    "syntax": "<id-selector> | <class-selector> | <attribute-selector> | <pseudo-class-selector>"
  },
  "supports-condition": {
    "syntax": "not <supports-in-parens> | <supports-in-parens> [ and <supports-in-parens> ]* | <supports-in-parens> [ or <supports-in-parens> ]*"
  },
  "supports-decl": {
    "syntax": "( <declaration> )"
  },
  "supports-feature": {
    "syntax": "<supports-decl> | <supports-selector-fn>"
  },
  "supports-in-parens": {
    "syntax": "( <supports-condition> ) | <supports-feature> | <general-enclosed>"
  },
  "supports-selector-fn": {
    "syntax": "selector( <complex-selector> )"
  },
  "symbol": {
    "syntax": "<string> | <image> | <custom-ident>"
  },
  "symbols()": {
    "syntax": "symbols( <symbols-type>? [ <string> | <image> ]+ )"
  },
  "symbols-type": {
    "syntax": "cyclic | numeric | alphabetic | symbolic | fixed"
  },
  "system-color": {
    "syntax": "AccentColor | AccentColorText | ActiveText | ButtonBorder | ButtonFace | ButtonText | Canvas | CanvasText | Field | FieldText | GrayText | Highlight | HighlightText | LinkText | Mark | MarkText | SelectedItem | SelectedItemText | VisitedText"
  },
  "tan()": {
    "syntax": "tan( <calc-sum> )"
  },
  "target": {
    "syntax": "<target-counter()> | <target-counters()> | <target-text()>"
  },
  "target-counter()": {
    "syntax": "target-counter( [ <string> | <url> ] , <custom-ident> , <counter-style>? )"
  },
  "target-counters()": {
    "syntax": "target-counters( [ <string> | <url> ] , <custom-ident> , <string> , <counter-style>? )"
  },
  "target-text()": {
    "syntax": "target-text( [ <string> | <url> ] , [ content | before | after | first-letter ]? )"
  },
  "text-edge": {
    "syntax": "[ text | cap | ex | ideographic | ideographic-ink ] [ text | alphabetic | ideographic | ideographic-ink ]?"
  },
  "time-percentage": {
    "syntax": "<time> | <percentage>"
  },
  "timeline-range-name": {
    "syntax": "cover | contain | entry | exit | entry-crossing | exit-crossing"
  },
  "track-breadth": {
    "syntax": "<length-percentage> | <flex> | min-content | max-content | auto"
  },
  "track-list": {
    "syntax": "[ <line-names>? [ <track-size> | <track-repeat> ] ]+ <line-names>?"
  },
  "track-repeat": {
    "syntax": "repeat( [ <integer [1,∞]> ] , [ <line-names>? <track-size> ]+ <line-names>? )"
  },
  "track-size": {
    "syntax": "<track-breadth> | minmax( <inflexible-breadth> , <track-breadth> ) | fit-content( <length-percentage> )"
  },
  "transform-function": {
    "syntax": "<matrix()> | <translate()> | <translateX()> | <translateY()> | <scale()> | <scaleX()> | <scaleY()> | <rotate()> | <skew()> | <skewX()> | <skewY()> | <matrix3d()> | <translate3d()> | <translateZ()> | <scale3d()> | <scaleZ()> | <rotate3d()> | <rotateX()> | <rotateY()> | <rotateZ()> | <perspective()>"
  },
  "transform-list": {
    "syntax": "<transform-function>+"
  },
  "transition-behavior-value": {
    "syntax": "normal | allow-discrete"
  },
  "translate()": {
    "syntax": "translate( <length-percentage> , <length-percentage>? )"
  },
  "translate3d()": {
    "syntax": "translate3d( <length-percentage> , <length-percentage> , <length> )"
  },
  "translateX()": {
    "syntax": "translateX( <length-percentage> )"
  },
  "translateY()": {
    "syntax": "translateY( <length-percentage> )"
  },
  "translateZ()": {
    "syntax": "translateZ( <length> )"
  },
  "try-size": {
    "syntax": "most-width | most-height | most-block-size | most-inline-size"
  },
  "try-tactic": {
    "syntax": "flip-block || flip-inline || flip-start"
  },
  "type-or-unit": {
    "syntax": "string | color | url | integer | number | length | angle | time | frequency | cap | ch | em | ex | ic | lh | rlh | rem | vb | vi | vw | vh | vmin | vmax | mm | Q | cm | in | pt | pc | px | deg | grad | rad | turn | ms | s | Hz | kHz | %"
  },
  "type-selector": {
    "syntax": "<wq-name> | <ns-prefix>? '*'"
  },
  "var()": {
    "syntax": "var( <custom-property-name> , <declaration-value>? )"
  },
  "view()": {
    "syntax": "view([<axis> || <'view-timeline-inset'>]?)"
  },
  "viewport-length": {
    "syntax": "auto | <length-percentage>"
  },
  "visual-box": {
    "syntax": "content-box | padding-box | border-box"
  },
  "wq-name": {
    "syntax": "<ns-prefix>? <ident-token>"
  },
  "xywh()": {
    "syntax": "xywh( <length-percentage>{2} <length-percentage [0,∞]>{2} [ round <'border-radius'> ]? )"
  },
  "xyz": {
    "syntax": "xyz | xyz-d50 | xyz-d65"
  },
  "xyz-params": {
    "syntax": "<xyz> [ <number> | <percentage> | none ]{3}"
  }
}