mdui/css-data.zh-cn.json

实现 material you 设计规范的 Web Components 组件库

{
  "version": 1.1,
  "properties": [
    {
      "name": "--mdui-breakpoint-xs",
      "description": {
        "kind": "markdown",
        "value": "断点值。默认为 `0px`\n\n**注意**：该断点值不支持在 CSS 媒体查询中使用。\n\n**示例**：\n```css\n/* 修改断点值 */\n:root {\n  --mdui-breakpoint-xs: 0px;\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#breakpoint"
        }
      ]
    },
    {
      "name": "--mdui-breakpoint-sm",
      "description": {
        "kind": "markdown",
        "value": "断点值。默认为 `600px`\n\n**注意**：该断点值不支持在 CSS 媒体查询中使用。\n\n**示例**：\n```css\n/* 修改断点值 */\n:root {\n  --mdui-breakpoint-sm: 620px;\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#breakpoint"
        }
      ]
    },
    {
      "name": "--mdui-breakpoint-md",
      "description": {
        "kind": "markdown",
        "value": "断点值。默认为 `840px`\n\n**注意**：该断点值不支持在 CSS 媒体查询中使用。\n\n**示例**：\n```css\n/* 修改断点值 */\n:root {\n  --mdui-breakpoint-md: 860px;\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#breakpoint"
        }
      ]
    },
    {
      "name": "--mdui-breakpoint-lg",
      "description": {
        "kind": "markdown",
        "value": "断点值。默认为 `1080px`\n\n**注意**：该断点值不支持在 CSS 媒体查询中使用。\n\n**示例**：\n```css\n/* 修改断点值 */\n:root {\n  --mdui-breakpoint-lg: 1100px;\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#breakpoint"
        }
      ]
    },
    {
      "name": "--mdui-breakpoint-xl",
      "description": {
        "kind": "markdown",
        "value": "断点值。默认为 `1440px`\n\n**注意**：该断点值不支持在 CSS 媒体查询中使用。\n\n**示例**：\n```css\n/* 修改断点值 */\n:root {\n  --mdui-breakpoint-xl: 1460px;\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#breakpoint"
        }
      ]
    },
    {
      "name": "--mdui-breakpoint-xxl",
      "description": {
        "kind": "markdown",
        "value": "断点值。默认为 `1920px`\n\n**注意**：该断点值不支持在 CSS 媒体查询中使用。\n\n**示例**：\n```css\n/* 修改断点值 */\n:root {\n  --mdui-breakpoint-xxl: 1940px;\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#breakpoint"
        }
      ]
    },
    {
      "name": "--mdui-color-primary-light",
      "description": {
        "kind": "markdown",
        "value": "**Primary**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-primary-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-primary-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-primary));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-primary), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-primary-container-light",
      "description": {
        "kind": "markdown",
        "value": "**Primary Container**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-primary-container-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-primary-container-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-primary-container));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-primary-container), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-on-primary-light",
      "description": {
        "kind": "markdown",
        "value": "**On Primary**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-on-primary-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-primary-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-primary));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-on-primary), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-on-primary-container-light",
      "description": {
        "kind": "markdown",
        "value": "**On Primary Container**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-on-primary-container-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-primary-container-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-primary-container));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-on-primary-container), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-inverse-primary-light",
      "description": {
        "kind": "markdown",
        "value": "**Inverse Primary**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-inverse-primary-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-inverse-primary-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-inverse-primary));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-inverse-primary), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-secondary-light",
      "description": {
        "kind": "markdown",
        "value": "**Secondary**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-secondary-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-secondary-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-secondary));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-secondary), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-secondary-container-light",
      "description": {
        "kind": "markdown",
        "value": "**Secondary Container**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-secondary-container-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-secondary-container-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-secondary-container));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-secondary-container), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-on-secondary-light",
      "description": {
        "kind": "markdown",
        "value": "**On Secondary**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-on-secondary-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-secondary-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-secondary));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-on-secondary), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-on-secondary-container-light",
      "description": {
        "kind": "markdown",
        "value": "**On Secondary Container**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-on-secondary-container-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-secondary-container-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-secondary-container));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-on-secondary-container), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-tertiary-light",
      "description": {
        "kind": "markdown",
        "value": "**Tertiary**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-tertiary-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-tertiary-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-tertiary));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-tertiary), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-tertiary-container-light",
      "description": {
        "kind": "markdown",
        "value": "**Tertiary Container**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-tertiary-container-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-tertiary-container-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-tertiary-container));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-tertiary-container), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-on-tertiary-light",
      "description": {
        "kind": "markdown",
        "value": "**On Tertiary**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-on-tertiary-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-tertiary-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-tertiary));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-on-tertiary), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-on-tertiary-container-light",
      "description": {
        "kind": "markdown",
        "value": "**On Tertiary Container**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-on-tertiary-container-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-tertiary-container-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-tertiary-container));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-on-tertiary-container), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-surface-light",
      "description": {
        "kind": "markdown",
        "value": "**Surface**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-surface-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-surface), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-surface-dim-light",
      "description": {
        "kind": "markdown",
        "value": "**Surface Dim**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-surface-dim-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-dim-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-dim));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-surface-dim), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-surface-bright-light",
      "description": {
        "kind": "markdown",
        "value": "**Surface Bright**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-surface-bright-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-bright-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-bright));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-surface-bright), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-surface-container-lowest-light",
      "description": {
        "kind": "markdown",
        "value": "**Surface Container Lowest**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-surface-container-lowest-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-container-lowest-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-container-lowest));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-surface-container-lowest), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-surface-container-low-light",
      "description": {
        "kind": "markdown",
        "value": "**Surface Container Low**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-surface-container-low-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-container-low-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-container-low));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-surface-container-low), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-surface-container-light",
      "description": {
        "kind": "markdown",
        "value": "**Surface Container**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-surface-container-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-container-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-container));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-surface-container), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-surface-container-high-light",
      "description": {
        "kind": "markdown",
        "value": "**Surface Container High**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-surface-container-high-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-container-high-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-container-high));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-surface-container-high), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-surface-container-highest-light",
      "description": {
        "kind": "markdown",
        "value": "**Surface Container Highest**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-surface-container-highest-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-container-highest-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-container-highest));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-surface-container-highest), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-surface-variant-light",
      "description": {
        "kind": "markdown",
        "value": "**Surface Variant**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-surface-variant-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-variant-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-variant));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-surface-variant), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-on-surface-light",
      "description": {
        "kind": "markdown",
        "value": "**On Surface**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-on-surface-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-surface-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-surface));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-on-surface), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-on-surface-variant-light",
      "description": {
        "kind": "markdown",
        "value": "**On Surface Variant**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-on-surface-variant-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-surface-variant-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-surface-variant));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-on-surface-variant), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-inverse-surface-light",
      "description": {
        "kind": "markdown",
        "value": "**Inverse Surface**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-inverse-surface-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-inverse-surface-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-inverse-surface));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-inverse-surface), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-inverse-on-surface-light",
      "description": {
        "kind": "markdown",
        "value": "**Inverse On Surface**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-inverse-on-surface-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-inverse-on-surface-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-inverse-on-surface));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-inverse-on-surface), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-background-light",
      "description": {
        "kind": "markdown",
        "value": "**Background**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-background-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-background-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-background));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-background), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-on-background-light",
      "description": {
        "kind": "markdown",
        "value": "**On Background**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-on-background-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-background-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-background));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-on-background), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-error-light",
      "description": {
        "kind": "markdown",
        "value": "**Error**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-error-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-error-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-error));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-error), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-error-container-light",
      "description": {
        "kind": "markdown",
        "value": "**Error Container**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-error-container-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-error-container-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-error-container));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-error-container), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-on-error-light",
      "description": {
        "kind": "markdown",
        "value": "**On Error**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-on-error-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-error-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-error));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-on-error), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-on-error-container-light",
      "description": {
        "kind": "markdown",
        "value": "**On Error Container**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-on-error-container-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-error-container-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-error-container));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-on-error-container), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-outline-light",
      "description": {
        "kind": "markdown",
        "value": "**Outline**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-outline-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-outline-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-outline));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-outline), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-outline-variant-light",
      "description": {
        "kind": "markdown",
        "value": "**Outline Variant**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-outline-variant-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-outline-variant-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-outline-variant));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-outline-variant), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-shadow-light",
      "description": {
        "kind": "markdown",
        "value": "**Shadow**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-shadow-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-shadow-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-shadow));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-shadow), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-surface-tint-color-light",
      "description": {
        "kind": "markdown",
        "value": "**Surface Tint Color**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-surface-tint-color-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-tint-color-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-tint-color));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-surface-tint-color), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-scrim-light",
      "description": {
        "kind": "markdown",
        "value": "**Scrim**\n\n亮色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变亮色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置亮色模式颜色值 */\n:root {\n  --mdui-color-scrim-light: 255, 0, 0;\n}\n\n/* 读取亮色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-scrim-light));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-scrim));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-scrim), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-primary-dark",
      "description": {
        "kind": "markdown",
        "value": "**Primary**\n\n暗色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变暗色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置暗色模式颜色值 */\n:root {\n  --mdui-color-primary-dark: 255, 0, 0;\n}\n\n/* 读取暗色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-primary-dark));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-primary));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-primary), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-primary-container-dark",
      "description": {
        "kind": "markdown",
        "value": "**Primary Container**\n\n暗色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变暗色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置暗色模式颜色值 */\n:root {\n  --mdui-color-primary-container-dark: 255, 0, 0;\n}\n\n/* 读取暗色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-primary-container-dark));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-primary-container));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-primary-container), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-on-primary-dark",
      "description": {
        "kind": "markdown",
        "value": "**On Primary**\n\n暗色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变暗色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置暗色模式颜色值 */\n:root {\n  --mdui-color-on-primary-dark: 255, 0, 0;\n}\n\n/* 读取暗色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-primary-dark));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-primary));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-on-primary), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-on-primary-container-dark",
      "description": {
        "kind": "markdown",
        "value": "**On Primary Container**\n\n暗色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变暗色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置暗色模式颜色值 */\n:root {\n  --mdui-color-on-primary-container-dark: 255, 0, 0;\n}\n\n/* 读取暗色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-primary-container-dark));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-primary-container));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-on-primary-container), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-inverse-primary-dark",
      "description": {
        "kind": "markdown",
        "value": "**Inverse Primary**\n\n暗色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变暗色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置暗色模式颜色值 */\n:root {\n  --mdui-color-inverse-primary-dark: 255, 0, 0;\n}\n\n/* 读取暗色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-inverse-primary-dark));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-inverse-primary));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-inverse-primary), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-secondary-dark",
      "description": {
        "kind": "markdown",
        "value": "**Secondary**\n\n暗色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变暗色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置暗色模式颜色值 */\n:root {\n  --mdui-color-secondary-dark: 255, 0, 0;\n}\n\n/* 读取暗色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-secondary-dark));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-secondary));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-secondary), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-secondary-container-dark",
      "description": {
        "kind": "markdown",
        "value": "**Secondary Container**\n\n暗色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变暗色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置暗色模式颜色值 */\n:root {\n  --mdui-color-secondary-container-dark: 255, 0, 0;\n}\n\n/* 读取暗色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-secondary-container-dark));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-secondary-container));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-secondary-container), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-on-secondary-dark",
      "description": {
        "kind": "markdown",
        "value": "**On Secondary**\n\n暗色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变暗色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置暗色模式颜色值 */\n:root {\n  --mdui-color-on-secondary-dark: 255, 0, 0;\n}\n\n/* 读取暗色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-secondary-dark));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-secondary));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-on-secondary), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-on-secondary-container-dark",
      "description": {
        "kind": "markdown",
        "value": "**On Secondary Container**\n\n暗色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变暗色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置暗色模式颜色值 */\n:root {\n  --mdui-color-on-secondary-container-dark: 255, 0, 0;\n}\n\n/* 读取暗色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-secondary-container-dark));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-secondary-container));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-on-secondary-container), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-tertiary-dark",
      "description": {
        "kind": "markdown",
        "value": "**Tertiary**\n\n暗色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变暗色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置暗色模式颜色值 */\n:root {\n  --mdui-color-tertiary-dark: 255, 0, 0;\n}\n\n/* 读取暗色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-tertiary-dark));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-tertiary));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-tertiary), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-tertiary-container-dark",
      "description": {
        "kind": "markdown",
        "value": "**Tertiary Container**\n\n暗色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变暗色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置暗色模式颜色值 */\n:root {\n  --mdui-color-tertiary-container-dark: 255, 0, 0;\n}\n\n/* 读取暗色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-tertiary-container-dark));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-tertiary-container));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-tertiary-container), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-on-tertiary-dark",
      "description": {
        "kind": "markdown",
        "value": "**On Tertiary**\n\n暗色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变暗色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置暗色模式颜色值 */\n:root {\n  --mdui-color-on-tertiary-dark: 255, 0, 0;\n}\n\n/* 读取暗色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-tertiary-dark));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-tertiary));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-on-tertiary), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-on-tertiary-container-dark",
      "description": {
        "kind": "markdown",
        "value": "**On Tertiary Container**\n\n暗色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变暗色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置暗色模式颜色值 */\n:root {\n  --mdui-color-on-tertiary-container-dark: 255, 0, 0;\n}\n\n/* 读取暗色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-tertiary-container-dark));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-tertiary-container));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-on-tertiary-container), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-surface-dark",
      "description": {
        "kind": "markdown",
        "value": "**Surface**\n\n暗色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变暗色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置暗色模式颜色值 */\n:root {\n  --mdui-color-surface-dark: 255, 0, 0;\n}\n\n/* 读取暗色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-dark));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-surface), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-surface-dim-dark",
      "description": {
        "kind": "markdown",
        "value": "**Surface Dim**\n\n暗色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变暗色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置暗色模式颜色值 */\n:root {\n  --mdui-color-surface-dim-dark: 255, 0, 0;\n}\n\n/* 读取暗色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-dim-dark));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-dim));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-surface-dim), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-surface-bright-dark",
      "description": {
        "kind": "markdown",
        "value": "**Surface Bright**\n\n暗色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变暗色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置暗色模式颜色值 */\n:root {\n  --mdui-color-surface-bright-dark: 255, 0, 0;\n}\n\n/* 读取暗色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-bright-dark));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-bright));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-surface-bright), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-surface-container-lowest-dark",
      "description": {
        "kind": "markdown",
        "value": "**Surface Container Lowest**\n\n暗色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变暗色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置暗色模式颜色值 */\n:root {\n  --mdui-color-surface-container-lowest-dark: 255, 0, 0;\n}\n\n/* 读取暗色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-container-lowest-dark));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-container-lowest));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-surface-container-lowest), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-surface-container-low-dark",
      "description": {
        "kind": "markdown",
        "value": "**Surface Container Low**\n\n暗色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变暗色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置暗色模式颜色值 */\n:root {\n  --mdui-color-surface-container-low-dark: 255, 0, 0;\n}\n\n/* 读取暗色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-container-low-dark));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-container-low));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-surface-container-low), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-surface-container-dark",
      "description": {
        "kind": "markdown",
        "value": "**Surface Container**\n\n暗色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变暗色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置暗色模式颜色值 */\n:root {\n  --mdui-color-surface-container-dark: 255, 0, 0;\n}\n\n/* 读取暗色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-container-dark));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-container));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-surface-container), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-surface-container-high-dark",
      "description": {
        "kind": "markdown",
        "value": "**Surface Container High**\n\n暗色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变暗色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置暗色模式颜色值 */\n:root {\n  --mdui-color-surface-container-high-dark: 255, 0, 0;\n}\n\n/* 读取暗色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-container-high-dark));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-container-high));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-surface-container-high), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-surface-container-highest-dark",
      "description": {
        "kind": "markdown",
        "value": "**Surface Container Highest**\n\n暗色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变暗色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置暗色模式颜色值 */\n:root {\n  --mdui-color-surface-container-highest-dark: 255, 0, 0;\n}\n\n/* 读取暗色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-container-highest-dark));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-container-highest));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-surface-container-highest), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-surface-variant-dark",
      "description": {
        "kind": "markdown",
        "value": "**Surface Variant**\n\n暗色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变暗色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置暗色模式颜色值 */\n:root {\n  --mdui-color-surface-variant-dark: 255, 0, 0;\n}\n\n/* 读取暗色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-variant-dark));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-surface-variant));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-surface-variant), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-on-surface-dark",
      "description": {
        "kind": "markdown",
        "value": "**On Surface**\n\n暗色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变暗色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置暗色模式颜色值 */\n:root {\n  --mdui-color-on-surface-dark: 255, 0, 0;\n}\n\n/* 读取暗色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-surface-dark));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-surface));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-on-surface), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-on-surface-variant-dark",
      "description": {
        "kind": "markdown",
        "value": "**On Surface Variant**\n\n暗色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变暗色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置暗色模式颜色值 */\n:root {\n  --mdui-color-on-surface-variant-dark: 255, 0, 0;\n}\n\n/* 读取暗色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-surface-variant-dark));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-on-surface-variant));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-on-surface-variant), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-inverse-surface-dark",
      "description": {
        "kind": "markdown",
        "value": "**Inverse Surface**\n\n暗色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变暗色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置暗色模式颜色值 */\n:root {\n  --mdui-color-inverse-surface-dark: 255, 0, 0;\n}\n\n/* 读取暗色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-inverse-surface-dark));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-inverse-surface));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-inverse-surface), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name": "--mdui-color-inverse-on-surface-dark",
      "description": {
        "kind": "markdown",
        "value": "**Inverse On Surface**\n\n暗色模式的 RGB 颜色值，RGB 三色用 `,` 分隔。\n\n修改该属性可以改变暗色模式下的颜色值。\n\n**示例**：\n```css\n/* 设置暗色模式颜色值 */\n:root {\n  --mdui-color-inverse-on-surface-dark: 255, 0, 0;\n}\n\n/* 读取暗色模式颜色值 */\n.element {\n  color: rgb(var(--mdui-color-inverse-on-surface-dark));\n}\n\n/* 读取自动适配的颜色值 */\n.element {\n  color: rgb(var(--mdui-color-inverse-on-surface));\n}\n\n/* 读取自动适配的颜色值，并添加不透明度 */\n.element {\n  color: rgba(var(--mdui-color-inverse-on-surface), 0.5);\n}\n```\n"
      },
      "references": [
        {
          "name": "开发文档",
          "url": "https://www.mdui.org/zh-cn/docs/2/styles/design-tokens#color"
        }
      ]
    },
    {
      "name