{
    "the-color-property": [
        {
            "engines": [
                "blink",
                "gecko",
                "webkit"
            ],
            "filename": "css/properties/color.json",
            "name": "color",
            "slug": "CSS/color",
            "mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/color",
            "summary": "The color CSS property sets the foreground color value of an element's text and text decorations, and sets the currentcolor value. currentcolor may be used as an indirect value on other properties and is the default for other color properties, such as border-color.",
            "support": {
                "chrome": {
                    "version_added": "1"
                },
                "chrome_android": "mirror",
                "edge": {
                    "version_added": "12"
                },
                "firefox": {
                    "version_added": "1"
                },
                "firefox_android": "mirror",
                "ie": {
                    "version_added": "3"
                },
                "oculus": "mirror",
                "opera": {
                    "version_added": "3.5"
                },
                "opera_android": {
                    "version_added": "10.1"
                },
                "safari": {
                    "version_added": "1"
                },
                "safari_ios": "mirror",
                "samsunginternet_android": "mirror",
                "webview_android": "mirror",
                "edge_blink": {
                    "version_added": "79"
                }
            },
            "title": "color"
        }
    ],
    "transparency": [
        {
            "engines": [
                "blink",
                "gecko",
                "webkit"
            ],
            "filename": "css/properties/opacity.json",
            "name": "opacity",
            "slug": "CSS/opacity",
            "mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/opacity",
            "summary": "The opacity CSS property sets the opacity of an element. Opacity is the degree to which content behind an element is hidden, and is the opposite of transparency.",
            "support": {
                "chrome": {
                    "version_added": "1"
                },
                "chrome_android": "mirror",
                "edge": {
                    "version_added": "12"
                },
                "firefox": [
                    {
                        "version_added": "1"
                    },
                    {
                        "prefix": "-moz-",
                        "version_added": "1",
                        "version_removed": "3.5"
                    }
                ],
                "firefox_android": "mirror",
                "ie": {
                    "version_added": "9"
                },
                "oculus": "mirror",
                "opera": {
                    "version_added": "9"
                },
                "opera_android": {
                    "version_added": "10.1"
                },
                "safari": [
                    {
                        "version_added": "2"
                    },
                    {
                        "version_added": "1.1",
                        "version_removed": "2",
                        "prefix": "-khtml-"
                    }
                ],
                "safari_ios": "mirror",
                "samsunginternet_android": "mirror",
                "webview_android": "mirror",
                "edge_blink": {
                    "version_added": "79"
                }
            },
            "title": "opacity"
        },
        {
            "engines": [],
            "filename": "svg/attributes/presentation.json",
            "name": "opacity",
            "slug": "SVG/Attribute/opacity",
            "mdn_url": "https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/opacity",
            "summary": "The opacity attribute specifies the transparency of an object or of a group of objects, that is, the degree to which the background behind the element is overlaid.",
            "support": {
                "chrome": {
                    "version_added": null
                },
                "chrome_android": "mirror",
                "edge": "mirror",
                "firefox": {
                    "version_added": null
                },
                "firefox_android": "mirror",
                "ie": {
                    "version_added": null
                },
                "oculus": "mirror",
                "opera": "mirror",
                "opera_android": "mirror",
                "safari": {
                    "version_added": null
                },
                "safari_ios": "mirror",
                "samsunginternet_android": "mirror",
                "webview_android": "mirror",
                "edge_blink": {
                    "version_added": null
                }
            },
            "title": "opacity"
        }
    ],
    "color-function": [
        {
            "engines": [
                "blink",
                "gecko",
                "webkit"
            ],
            "filename": "css/types/color.json",
            "name": "color",
            "slug": "CSS/color_value/color",
            "mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/color_value/color",
            "summary": "The color() functional notation allows a color to be specified in a particular, specified colorspace rather than the implicit sRGB colorspace that most of the other color functions operate in.",
            "support": {
                "chrome": {
                    "version_added": "111"
                },
                "chrome_android": "mirror",
                "edge": "mirror",
                "firefox": {
                    "version_added": "113"
                },
                "firefox_android": "mirror",
                "ie": {
                    "version_added": false
                },
                "oculus": "mirror",
                "opera": "mirror",
                "opera_android": "mirror",
                "safari": [
                    {
                        "version_added": "15"
                    },
                    {
                        "version_added": "10.1",
                        "version_removed": "15",
                        "partial_implementation": true,
                        "notes": "Only supports <code>display-p3</code> and <code>srgb</code> predefined color profiles."
                    }
                ],
                "safari_ios": "mirror",
                "samsunginternet_android": "mirror",
                "webview_android": "mirror",
                "edge_blink": {
                    "version_added": "111"
                }
            },
            "caniuse": {
                "feature": "css-color-function",
                "title": "CSS color() function"
            },
            "title": "color()"
        }
    ],
    "currentcolor-color": [
        {
            "engines": [
                "blink",
                "gecko",
                "webkit"
            ],
            "filename": "css/types/color.json",
            "name": "currentcolor",
            "slug": "CSS/color_value#currentcolor",
            "mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/color_value#currentcolor",
            "summary": "The <color> CSS data type represents a color. A <color> may also include an alpha-channel transparency value, indicating how the color should composite with its background.",
            "support": {
                "chrome": {
                    "version_added": "1"
                },
                "chrome_android": "mirror",
                "edge": {
                    "version_added": "12"
                },
                "firefox": {
                    "version_added": "1.5"
                },
                "firefox_android": "mirror",
                "ie": {
                    "version_added": "9"
                },
                "oculus": "mirror",
                "opera": {
                    "version_added": "9.5"
                },
                "opera_android": "mirror",
                "safari": {
                    "version_added": "4"
                },
                "safari_ios": "mirror",
                "samsunginternet_android": "mirror",
                "webview_android": {
                    "version_added": "37"
                },
                "edge_blink": {
                    "version_added": "79"
                }
            },
            "caniuse": {
                "feature": "currentcolor",
                "title": "CSS currentColor value"
            },
            "title": "<color>"
        }
    ],
    "the-hsl-notation": [
        {
            "engines": [
                "blink",
                "gecko",
                "webkit"
            ],
            "filename": "css/types/color.json",
            "name": "hsl",
            "slug": "CSS/color_value/hsl",
            "mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/color_value/hsl",
            "summary": "The hsl() functional notation expresses an sRGB color according to its hue, saturation, and lightness components. An optional alpha component represents the color's transparency.",
            "support": {
                "chrome": {
                    "version_added": "1"
                },
                "chrome_android": "mirror",
                "edge": {
                    "version_added": "12"
                },
                "firefox": {
                    "version_added": "1"
                },
                "firefox_android": "mirror",
                "ie": {
                    "version_added": "9"
                },
                "oculus": "mirror",
                "opera": {
                    "version_added": "9.5"
                },
                "opera_android": {
                    "version_added": "10.1"
                },
                "safari": {
                    "version_added": "3.1"
                },
                "safari_ios": "mirror",
                "samsunginternet_android": "mirror",
                "webview_android": {
                    "version_added": "37"
                },
                "edge_blink": {
                    "version_added": "79"
                }
            },
            "title": "hsl()"
        }
    ],
    "rgb-functions": [
        {
            "engines": [
                "blink",
                "gecko",
                "webkit"
            ],
            "filename": "css/types/color.json",
            "name": "hsla",
            "slug": "CSS/color_value/hsla",
            "mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/color_value/hsla",
            "summary": "The hsl() functional notation expresses an sRGB color according to its hue, saturation, and lightness components. An optional alpha component represents the color's transparency.",
            "support": {
                "chrome": {
                    "version_added": "1"
                },
                "chrome_android": "mirror",
                "edge": {
                    "version_added": "12"
                },
                "firefox": {
                    "version_added": "3"
                },
                "firefox_android": "mirror",
                "ie": {
                    "version_added": "9"
                },
                "oculus": "mirror",
                "opera": {
                    "version_added": "10"
                },
                "opera_android": {
                    "version_added": "10.1"
                },
                "safari": {
                    "version_added": "3.1"
                },
                "safari_ios": "mirror",
                "samsunginternet_android": "mirror",
                "webview_android": {
                    "version_added": "37"
                },
                "edge_blink": {
                    "version_added": "79"
                }
            },
            "title": "hsl()"
        },
        {
            "engines": [
                "blink",
                "gecko",
                "webkit"
            ],
            "filename": "css/types/color.json",
            "name": "rgb",
            "slug": "CSS/color_value/rgb",
            "mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/color_value/rgb",
            "summary": "The rgb() functional notation expresses a color according to its red, green, and blue components. An optional alpha component represents the color's transparency.",
            "support": {
                "chrome": {
                    "version_added": "1"
                },
                "chrome_android": "mirror",
                "edge": {
                    "version_added": "12"
                },
                "firefox": {
                    "version_added": "1"
                },
                "firefox_android": "mirror",
                "ie": {
                    "version_added": "4"
                },
                "oculus": "mirror",
                "opera": {
                    "version_added": "3.5"
                },
                "opera_android": {
                    "version_added": "10.1"
                },
                "safari": {
                    "version_added": "1"
                },
                "safari_ios": "mirror",
                "samsunginternet_android": "mirror",
                "webview_android": {
                    "version_added": "37"
                },
                "edge_blink": {
                    "version_added": "79"
                }
            },
            "title": "rgb()"
        },
        {
            "engines": [
                "blink",
                "gecko",
                "webkit"
            ],
            "filename": "css/types/color.json",
            "name": "rgba",
            "slug": "CSS/color_value/rgba",
            "mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/color_value/rgba",
            "summary": "The rgb() functional notation expresses a color according to its red, green, and blue components. An optional alpha component represents the color's transparency.",
            "support": {
                "chrome": {
                    "version_added": "1"
                },
                "chrome_android": "mirror",
                "edge": {
                    "version_added": "12"
                },
                "firefox": {
                    "version_added": "3"
                },
                "firefox_android": "mirror",
                "ie": {
                    "version_added": "9"
                },
                "oculus": "mirror",
                "opera": {
                    "version_added": "10"
                },
                "opera_android": {
                    "version_added": "10.1"
                },
                "safari": {
                    "version_added": "3.1"
                },
                "safari_ios": "mirror",
                "samsunginternet_android": "mirror",
                "webview_android": {
                    "version_added": "37"
                },
                "edge_blink": {
                    "version_added": "79"
                }
            },
            "title": "rgb()"
        }
    ],
    "the-hwb-notation": [
        {
            "engines": [
                "blink",
                "gecko",
                "webkit"
            ],
            "filename": "css/types/color.json",
            "name": "hwb",
            "slug": "CSS/color_value/hwb",
            "mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/color_value/hwb",
            "summary": "The hwb() functional notation expresses a given color according to its hue, whiteness, and blackness. An optional alpha component represents the color's transparency.",
            "support": {
                "chrome": {
                    "version_added": "101"
                },
                "chrome_android": "mirror",
                "edge": "mirror",
                "firefox": {
                    "version_added": "96"
                },
                "firefox_android": "mirror",
                "ie": {
                    "version_added": false
                },
                "oculus": "mirror",
                "opera": "mirror",
                "opera_android": "mirror",
                "safari": {
                    "version_added": "15"
                },
                "safari_ios": "mirror",
                "samsunginternet_android": "mirror",
                "webview_android": "mirror",
                "edge_blink": {
                    "version_added": "101"
                }
            },
            "title": "hwb()"
        }
    ],
    "lab-colors": [
        {
            "engines": [
                "blink",
                "gecko",
                "webkit"
            ],
            "filename": "css/types/color.json",
            "name": "lab",
            "slug": "CSS/color_value/lab",
            "mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/color_value/lab",
            "summary": "The lab() functional notation expresses a given color in the CIE L*a*b* color space. Lab represents the entire range of color that humans can see.",
            "support": {
                "chrome": {
                    "version_added": "111"
                },
                "chrome_android": "mirror",
                "edge": "mirror",
                "firefox": {
                    "version_added": "113"
                },
                "firefox_android": "mirror",
                "ie": {
                    "version_added": false
                },
                "oculus": "mirror",
                "opera": "mirror",
                "opera_android": "mirror",
                "safari": {
                    "version_added": "15"
                },
                "safari_ios": "mirror",
                "samsunginternet_android": "mirror",
                "webview_android": "mirror",
                "edge_blink": {
                    "version_added": "111"
                }
            },
            "title": "lab()"
        },
        {
            "engines": [
                "blink",
                "gecko",
                "webkit"
            ],
            "filename": "css/types/color.json",
            "name": "lch",
            "slug": "CSS/color_value/lch",
            "mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/color_value/lch",
            "summary": "The lch() functional notation expresses a given color in the LCH color space. It has the same L axis as lab(), but uses polar coordinates C (Chroma) and H (Hue).",
            "support": {
                "chrome": {
                    "version_added": "111"
                },
                "chrome_android": "mirror",
                "edge": "mirror",
                "firefox": {
                    "version_added": "113"
                },
                "firefox_android": "mirror",
                "ie": {
                    "version_added": false
                },
                "oculus": "mirror",
                "opera": "mirror",
                "opera_android": "mirror",
                "safari": {
                    "version_added": "15"
                },
                "safari_ios": "mirror",
                "samsunginternet_android": "mirror",
                "webview_android": "mirror",
                "edge_blink": {
                    "version_added": "111"
                }
            },
            "title": "lch()"
        }
    ],
    "named-colors": [
        {
            "engines": [
                "blink",
                "gecko",
                "webkit"
            ],
            "filename": "css/types/color.json",
            "name": "named-color",
            "slug": "CSS/named-color",
            "mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/named-color",
            "summary": "The <named-color> CSS data type is the name of a color, such as red, blue, black, or lightseagreen. Syntactically, a <named-color> is an <ident>.",
            "support": {
                "chrome": {
                    "version_added": "1"
                },
                "chrome_android": "mirror",
                "edge": {
                    "version_added": "12"
                },
                "firefox": {
                    "version_added": "1"
                },
                "firefox_android": "mirror",
                "ie": {
                    "version_added": "3",
                    "notes": "Internet Explorer 8 and later support gray color keywords spelled with an <em>e</em> (<code>grey</code>, <code>darkgrey</code>, <code>darkslategrey</code>, <code>dimgrey</code>, <code>lightgrey</code>, and <code>lightslategrey</code>). Internet Explorer 3 to Internet Explorer 7 only support the keywords spelled with <em>a</em> (<code>gray</code>, <code>darkgray</code>, <code>darkslategray</code>, <code>dimgray</code>, <code>lightgray</code>, and <code>lightslategray</code>)."
                },
                "oculus": "mirror",
                "opera": {
                    "version_added": "3.5"
                },
                "opera_android": {
                    "version_added": "10.1"
                },
                "safari": {
                    "version_added": "1"
                },
                "safari_ios": "mirror",
                "samsunginternet_android": "mirror",
                "webview_android": {
                    "version_added": "37"
                },
                "edge_blink": {
                    "version_added": "79"
                }
            },
            "title": "<named-color>"
        }
    ],
    "ok-lab": [
        {
            "engines": [
                "blink",
                "gecko",
                "webkit"
            ],
            "filename": "css/types/color.json",
            "name": "oklab",
            "slug": "CSS/color_value/oklab",
            "mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/color_value/oklab",
            "summary": "The oklab() functional notation expresses a given color in the Oklab color space, which attempts to mimic how color is perceived by the human eye. The oklab() works with a Cartesian coordinate system on the Oklab color space, the a- and b-axes. If you want a polar color system, chroma and hue, use oklch().",
            "support": {
                "chrome": {
                    "version_added": "111"
                },
                "chrome_android": "mirror",
                "edge": "mirror",
                "firefox": {
                    "version_added": "113"
                },
                "firefox_android": "mirror",
                "ie": {
                    "version_added": false
                },
                "oculus": "mirror",
                "opera": "mirror",
                "opera_android": "mirror",
                "safari": {
                    "version_added": "15.4"
                },
                "safari_ios": "mirror",
                "samsunginternet_android": "mirror",
                "webview_android": "mirror",
                "edge_blink": {
                    "version_added": "111"
                }
            },
            "title": "oklab()"
        },
        {
            "engines": [
                "blink",
                "gecko",
                "webkit"
            ],
            "filename": "css/types/color.json",
            "name": "oklch",
            "slug": "CSS/color_value/oklch",
            "mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/color_value/oklch",
            "summary": "The oklch() functional notation expresses a given color in the Oklch color space. It has the same L axis as oklab(), but uses polar coordinates C (Chroma) and H (Hue).",
            "support": {
                "chrome": {
                    "version_added": "111"
                },
                "chrome_android": "mirror",
                "edge": "mirror",
                "firefox": {
                    "version_added": "113"
                },
                "firefox_android": "mirror",
                "ie": {
                    "version_added": false
                },
                "oculus": "mirror",
                "opera": "mirror",
                "opera_android": "mirror",
                "safari": {
                    "version_added": "15.4"
                },
                "safari_ios": "mirror",
                "samsunginternet_android": "mirror",
                "webview_android": "mirror",
                "edge_blink": {
                    "version_added": "111"
                }
            },
            "title": "oklch()"
        }
    ],
    "hex-notation": [
        {
            "engines": [
                "blink",
                "gecko",
                "webkit"
            ],
            "filename": "css/types/color.json",
            "name": "rgb_hexadecimal_notation",
            "slug": "CSS/hex-color",
            "mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/hex-color",
            "summary": "The <hex-color> CSS data type is a notation for describing the hexadecimal color syntax of an sRGB color using its primary color components (red, green, blue) written as hexadecimal numbers, as well as its transparency.",
            "support": {
                "chrome": {
                    "version_added": "1"
                },
                "chrome_android": "mirror",
                "edge": {
                    "version_added": "12"
                },
                "firefox": {
                    "version_added": "1"
                },
                "firefox_android": "mirror",
                "ie": {
                    "version_added": "3"
                },
                "oculus": "mirror",
                "opera": {
                    "version_added": "3.5"
                },
                "opera_android": {
                    "version_added": "10.1"
                },
                "safari": {
                    "version_added": "1"
                },
                "safari_ios": "mirror",
                "samsunginternet_android": "mirror",
                "webview_android": {
                    "version_added": "37"
                },
                "edge_blink": {
                    "version_added": "79"
                }
            },
            "caniuse": {
                "feature": "css-rrggbbaa",
                "title": "#rrggbbaa hex color notation"
            },
            "title": "<hex-color>"
        }
    ],
    "css-system-colors": [
        {
            "engines": [
                "blink",
                "gecko",
                "webkit"
            ],
            "filename": "css/types/color.json",
            "name": "system-color",
            "slug": "CSS/system-color",
            "mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/system-color",
            "summary": "The <system-color> CSS data type usually reflects the default color choices used for the different parts of a web page.",
            "support": {
                "chrome": {
                    "version_added": "1"
                },
                "chrome_android": "mirror",
                "edge": {
                    "version_added": "12"
                },
                "firefox": {
                    "version_added": "1"
                },
                "firefox_android": "mirror",
                "ie": {
                    "version_added": "3"
                },
                "oculus": "mirror",
                "opera": {
                    "version_added": "3.5"
                },
                "opera_android": {
                    "version_added": "10.1"
                },
                "safari": {
                    "version_added": "1"
                },
                "safari_ios": "mirror",
                "samsunginternet_android": "mirror",
                "webview_android": {
                    "version_added": "37"
                },
                "edge_blink": {
                    "version_added": "79"
                }
            },
            "title": "<system-color>"
        }
    ],
    "transparent-color": [
        {
            "engines": [
                "blink",
                "gecko",
                "webkit"
            ],
            "filename": "css/types/color.json",
            "name": "transparent",
            "slug": "CSS/named-color#transparent",
            "mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/named-color#transparent",
            "summary": "The <named-color> CSS data type is the name of a color, such as red, blue, black, or lightseagreen. Syntactically, a <named-color> is an <ident>.",
            "support": {
                "chrome": {
                    "version_added": "1"
                },
                "chrome_android": "mirror",
                "edge": {
                    "version_added": "12"
                },
                "firefox": {
                    "version_added": "3"
                },
                "firefox_android": "mirror",
                "ie": {
                    "version_added": "9"
                },
                "oculus": "mirror",
                "opera": {
                    "version_added": "10"
                },
                "opera_android": {
                    "version_added": "10.1"
                },
                "safari": {
                    "version_added": "3.1"
                },
                "safari_ios": "mirror",
                "samsunginternet_android": "mirror",
                "webview_android": {
                    "version_added": "37"
                },
                "edge_blink": {
                    "version_added": "79"
                }
            },
            "title": "<named-color>"
        }
    ],
    "color-syntax": [
        {
            "engines": [
                "blink",
                "gecko",
                "webkit"
            ],
            "filename": "css/types/color.json",
            "name": "color",
            "slug": "CSS/color_value",
            "mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/color_value",
            "summary": "The <color> CSS data type represents a color. A <color> may also include an alpha-channel transparency value, indicating how the color should composite with its background.",
            "support": {
                "chrome": {
                    "version_added": "1"
                },
                "chrome_android": "mirror",
                "edge": {
                    "version_added": "12"
                },
                "firefox": {
                    "version_added": "1"
                },
                "firefox_android": "mirror",
                "ie": {
                    "version_added": "3"
                },
                "oculus": "mirror",
                "opera": {
                    "version_added": "3.5"
                },
                "opera_android": {
                    "version_added": "10.1"
                },
                "safari": {
                    "version_added": "1"
                },
                "safari_ios": "mirror",
                "samsunginternet_android": "mirror",
                "webview_android": "mirror",
                "edge_blink": {
                    "version_added": "79"
                }
            },
            "title": "<color>"
        }
    ]
}