#主题变量参考
本页由主题变量定义自动生成,共 292 个变量。作用范围和使用方式见主题编写指南。修改变量后运行 pnpm theme:generate;文档构建会检查生成结果是否同步。
下载 JSON Schema
。在 v2 主题 JSON 顶层加入 "$schema": "https://aino.md/schemas/appearance-theme.v2.zh-cn.schema.json",支持 JSON
Schema 的编辑器即可提供字段补全与结构检查。Schema
检查变量名、类型和基本字面量语法;颜色函数、阴影等字符串内部的数值范围仍以 Aino 导入校验为准。离线时可下载
Schema,改用本地相对路径。
Schema 说明支持全部 9 种界面语言。除英文使用默认地址外,其他语言在文件名中加入语言代码,例如 appearance-theme.v2.ja.schema.json。支持的语言代码:zh-cn、zh-tw、ja、de、fr、es、pt、ar。
所有变量值均为字符串。示例只展示一种有效写法,不代表默认值。
| 变量 | 分组 | 类型 | 示例 |
|---|---|---|---|
--accent-primary | 强调色 | 颜色 | #abc |
--accent-secondary | 强调色 | 颜色 | #abc |
--accent-soft | 强调色 | 颜色 | #abc |
--accent-strong | 强调色 | 颜色 | #abc |
--accent-tertiary | 强调色 | 颜色 | #abc |
--button-background | Aino 按钮 | 颜色 | #abc |
--button-background-active | Aino 按钮 | 颜色 | #abc |
--button-background-hover | Aino 按钮 | 颜色 | #abc |
--button-border-color | Aino 按钮 | 颜色 | #abc |
--button-border-color-hover | Aino 按钮 | 颜色 | #abc |
--button-color | Aino 按钮 | 颜色 | #abc |
--button-color-hover | Aino 按钮 | 颜色 | #abc |
--button-font-weight | Aino 按钮 | 字重 | normal |
--button-radius | Aino 按钮 | 圆角 | 0 |
--button-shadow | Aino 按钮 | 阴影 | none |
--card-background | Aino 卡片 | 颜色 | #abc |
--card-background-hover | Aino 卡片 | 颜色 | #abc |
--card-border-color | Aino 卡片 | 颜色 | #abc |
--card-border-width | Aino 卡片 | 长度 | 0 |
--card-radius | Aino 卡片 | 圆角 | 0 |
--card-shadow | Aino 卡片 | 阴影 | none |
--input-background | Aino 输入框 | 颜色 | #abc |
--input-background-hover | Aino 输入框 | 颜色 | #abc |
--input-border-color | Aino 输入框 | 颜色 | #abc |
--input-border-color-focus | Aino 输入框 | 颜色 | #abc |
--input-color | Aino 输入框 | 颜色 | #abc |
--input-placeholder-color | Aino 输入框 | 颜色 | #abc |
--input-shadow | Aino 输入框 | 阴影 | none |
--modal-backdrop-blur | Aino 材质 | 长度 | 0 |
--modal-backdrop-saturation | Aino 材质 | 比率 | 0 |
--toast-backdrop-blur | Aino 提示消息 | 长度 | 0 |
--toast-backdrop-saturation | Aino 提示消息 | 比率 | 0 |
--toast-background | Aino 提示消息 | 颜色 | #abc |
--toast-border-color | Aino 提示消息 | 颜色 | #abc |
--toast-border-width | Aino 提示消息 | 长度 | 0 |
--toast-radius | Aino 提示消息 | 圆角 | 0 |
--toast-shadow | Aino 提示消息 | 阴影 | none |
--toolbar-backdrop-blur | Aino 工具栏 | 长度 | 0 |
--toolbar-backdrop-saturation | Aino 工具栏 | 比率 | 0 |
--toolbar-background | Aino 工具栏 | 颜色 | #abc |
--toolbar-border-color | Aino 工具栏 | 颜色 | #abc |
--toolbar-shadow | Aino 工具栏 | 阴影 | none |
--border-color | 边框 | 颜色 | #abc |
--border-color-strong | 边框 | 颜色 | #abc |
--border-color-subtle | 边框 | 颜色 | #abc |
--editor-border-color | 编辑器 | 颜色 | #abc |
--editor-surface-primary | 编辑器 | 颜色 | #abc |
--editor-surface-secondary | 编辑器 | 颜色 | #abc |
--editor-surface-tertiary | 编辑器 | 颜色 | #abc |
--focus-ring-shadow | 阴影与焦点 | 阴影 | none |
--shadow-glow | 阴影与焦点 | 阴影 | none |
--shadow-lg | 阴影与焦点 | 阴影 | none |
--shadow-md | 阴影与焦点 | 阴影 | none |
--shadow-sm | 阴影与焦点 | 阴影 | none |
--clickable-icon-radius | 图标 | 圆角 | 0 |
--icon-color | 图标 | 颜色 | #abc |
--icon-color-active | 图标 | 颜色 | #abc |
--icon-color-hover | 图标 | 颜色 | #abc |
--icon-opacity | 图标 | 不透明度 | 0 |
--icon-opacity-hover | 图标 | 不透明度 | 0 |
--icon-size | 图标 | 长度 | 0 |
--icon-stroke | 图标 | 比率 | 0 |
--editor-link-color | 链接 | 颜色 | #abc |
--editor-link-hover-color | 链接 | 颜色 | #abc |
--link-color | 链接 | 颜色 | #abc |
--link-hover-color | 链接 | 颜色 | #abc |
--menu-background | 菜单 | 颜色 | #abc |
--menu-border-color | 菜单 | 颜色 | #abc |
--menu-item-background-hover | 菜单 | 颜色 | #abc |
--menu-item-color | 菜单 | 颜色 | #abc |
--menu-item-color-hover | 菜单 | 颜色 | #abc |
--menu-item-padding-x | 菜单 | 长度 | 0 |
--menu-item-padding-y | 菜单 | 长度 | 0 |
--menu-radius | 菜单 | 圆角 | 0 |
--menu-shadow | 菜单 | 阴影 | none |
--motion-curve-emphasis | 动效 | 缓动 | linear |
--motion-curve-soft | 动效 | 缓动 | linear |
--motion-duration-fast | 动效 | 时长 | 0ms |
--motion-duration-normal | 动效 | 时长 | 0ms |
--motion-duration-slow | 动效 | 时长 | 0ms |
--blockquote-background-color | 引用 | 颜色 | #abc |
--blockquote-border-color | 引用 | 颜色 | #abc |
--blockquote-border-thickness | 引用 | 长度 | 0 |
--blockquote-color | 引用 | 颜色 | #abc |
--blockquote-font-style | 引用 | 字形 | normal |
--checkbox-border-color | 任务复选框 | 颜色 | #abc |
--checkbox-border-color-hover | 任务复选框 | 颜色 | #abc |
--checkbox-color | 任务复选框 | 颜色 | #abc |
--checkbox-color-hover | 任务复选框 | 颜色 | #abc |
--checkbox-marker-color | 任务复选框 | 颜色 | #abc |
--code-background | 代码 | 颜色 | #abc |
--code-comment | 代码 | 颜色 | #abc |
--code-function | 代码 | 颜色 | #abc |
--code-important | 代码 | 颜色 | #abc |
--code-keyword | 代码 | 颜色 | #abc |
--code-normal | 代码 | 颜色 | #abc |
--code-operator | 代码 | 颜色 | #abc |
--code-property | 代码 | 颜色 | #abc |
--code-punctuation | 代码 | 颜色 | #abc |
--code-size | 代码 | 字号 | 18px |
--code-string | 代码 | 颜色 | #abc |
--code-tag | 代码 | 颜色 | #abc |
--code-value | 代码 | 颜色 | #abc |
--hr-color | 编辑器 | 颜色 | #abc |
--hr-thickness | 编辑器 | 长度 | 0 |
--background-modifier-active-hover | 基础变量 | 颜色 | #abc |
--background-modifier-border | 基础变量 | 颜色 | #abc |
--background-modifier-border-focus | 基础变量 | 颜色 | #abc |
--background-modifier-border-hover | 基础变量 | 颜色 | #abc |
--background-modifier-hover | 基础变量 | 颜色 | #abc |
--background-primary | 基础变量 | 颜色 | #abc |
--background-primary-alt | 基础变量 | 颜色 | #abc |
--background-secondary | 基础变量 | 颜色 | #abc |
--background-secondary-alt | 基础变量 | 颜色 | #abc |
--caret-color | 基础变量 | 颜色 | #abc |
--color-accent | 基础变量 | 颜色 | #abc |
--color-accent-1 | 基础变量 | 颜色 | #abc |
--color-accent-2 | 基础变量 | 颜色 | #abc |
--interactive-accent | 基础变量 | 颜色 | #abc |
--interactive-accent-hover | 基础变量 | 颜色 | #abc |
--interactive-hover | 基础变量 | 颜色 | #abc |
--interactive-normal | 基础变量 | 颜色 | #abc |
--radius-l | 基础变量 | 圆角 | 0 |
--radius-m | 基础变量 | 圆角 | 0 |
--radius-s | 基础变量 | 圆角 | 0 |
--text-accent | 基础变量 | 颜色 | #abc |
--text-accent-hover | 基础变量 | 颜色 | #abc |
--text-error | 基础变量 | 颜色 | #abc |
--text-faint | 基础变量 | 颜色 | #abc |
--text-highlight-bg | 基础变量 | 颜色 | #abc |
--text-normal | 基础变量 | 颜色 | #abc |
--text-on-accent | 基础变量 | 颜色 | #abc |
--text-on-accent-inverted | 基础变量 | 颜色 | #abc |
--text-selection | 基础变量 | 颜色 | #abc |
--text-success | 基础变量 | 颜色 | #abc |
--text-warning | 基础变量 | 颜色 | #abc |
--h1-color | 标题 | 颜色 | #abc |
--h1-size | 标题 | 字号 | 18px |
--h1-weight | 标题 | 字重 | normal |
--h2-color | 标题 | 颜色 | #abc |
--h2-size | 标题 | 字号 | 18px |
--h2-weight | 标题 | 字重 | normal |
--h3-color | 标题 | 颜色 | #abc |
--h3-size | 标题 | 字号 | 18px |
--h3-weight | 标题 | 字重 | normal |
--h4-color | 标题 | 颜色 | #abc |
--h4-size | 标题 | 字号 | 18px |
--h4-weight | 标题 | 字重 | normal |
--h5-color | 标题 | 颜色 | #abc |
--h5-size | 标题 | 字号 | 18px |
--h5-weight | 标题 | 字重 | normal |
--h6-color | 标题 | 颜色 | #abc |
--h6-size | 标题 | 字号 | 18px |
--h6-weight | 标题 | 字重 | normal |
--heading-formatting | 标题 | 颜色 | #abc |
--input-border-width | 输入框 | 长度 | 0 |
--input-font-weight | 输入框 | 字重 | normal |
--input-radius | 输入框 | 圆角 | 0 |
--link-color-hover | 链接 | 颜色 | #abc |
--link-external-color | 链接 | 颜色 | #abc |
--link-external-color-hover | 链接 | 颜色 | #abc |
--link-unresolved-color | 链接 | 颜色 | #abc |
--list-indent | 列表 | 长度 | 0 |
--list-marker-color | 列表 | 颜色 | #abc |
--list-marker-color-hover | 列表 | 颜色 | #abc |
--list-spacing | 列表 | 长度 | 0 |
--modal-background | 弹窗 | 颜色 | #abc |
--modal-border-color | 弹窗 | 颜色 | #abc |
--modal-border-width | 弹窗 | 长度 | 0 |
--modal-radius | 弹窗 | 圆角 | 0 |
--nav-collapse-icon-color | 导航 | 颜色 | #abc |
--nav-collapse-icon-color-collapsed | 导航 | 颜色 | #abc |
--nav-indentation-guide-color | 导航 | 颜色 | #abc |
--nav-indentation-guide-width | 导航 | 长度 | 0 |
--nav-item-background-active | 导航 | 颜色 | #abc |
--nav-item-background-hover | 导航 | 颜色 | #abc |
--nav-item-background-selected | 导航 | 颜色 | #abc |
--nav-item-color | 导航 | 颜色 | #abc |
--nav-item-color-active | 导航 | 颜色 | #abc |
--nav-item-color-highlighted | 导航 | 颜色 | #abc |
--nav-item-color-hover | 导航 | 颜色 | #abc |
--nav-item-color-selected | 导航 | 颜色 | #abc |
--nav-item-weight | 导航 | 字重 | normal |
--nav-item-weight-active | 导航 | 字重 | normal |
--nav-item-weight-hover | 导航 | 字重 | normal |
--color-blue | 调色板 | 颜色 | #abc |
--color-cyan | 调色板 | 颜色 | #abc |
--color-green | 调色板 | 颜色 | #abc |
--color-orange | 调色板 | 颜色 | #abc |
--color-pink | 调色板 | 颜色 | #abc |
--color-purple | 调色板 | 颜色 | #abc |
--color-red | 调色板 | 颜色 | #abc |
--color-yellow | 调色板 | 颜色 | #abc |
--table-background | 表格 | 颜色 | #abc |
--table-border-color | 表格 | 颜色 | #abc |
--table-border-width | 表格 | 长度 | 0 |
--table-header-background | 表格 | 颜色 | #abc |
--table-header-border-color | 表格 | 颜色 | #abc |
--table-header-color | 表格 | 颜色 | #abc |
--table-header-weight | 表格 | 字重 | normal |
--table-row-alt-background | 表格 | 颜色 | #abc |
--table-row-background-hover | 表格 | 颜色 | #abc |
--table-selection | 表格 | 颜色 | #abc |
--table-text-color | 表格 | 颜色 | #abc |
--tab-background-active | 页签 | 颜色 | #abc |
--tab-container-background | 页签 | 颜色 | #abc |
--tab-divider-color | 页签 | 颜色 | #abc |
--tab-font-size | 页签 | 字号 | 18px |
--tab-font-weight | 页签 | 字重 | normal |
--tab-radius | 页签 | 圆角 | 0 |
--tab-radius-active | 页签 | 圆角 | 0 |
--tab-text-color | 页签 | 颜色 | #abc |
--tab-text-color-active | 页签 | 颜色 | #abc |
--tag-background | 标签 | 颜色 | #abc |
--tag-background-hover | 标签 | 颜色 | #abc |
--tag-border-color | 标签 | 颜色 | #abc |
--tag-border-color-hover | 标签 | 颜色 | #abc |
--tag-border-width | 标签 | 长度 | 0 |
--tag-color | 标签 | 颜色 | #abc |
--tag-color-hover | 标签 | 颜色 | #abc |
--tag-radius | 标签 | 圆角 | 0 |
--tag-size | 标签 | 字号 | 18px |
--tag-weight | 标签 | 字重 | normal |
--bold-color | 排版 | 颜色 | #abc |
--italic-color | 排版 | 颜色 | #abc |
--scrollbar-active-thumb-bg | 滚动条 | 颜色 | #abc |
--scrollbar-bg | 滚动条 | 颜色 | #abc |
--scrollbar-thumb-bg | 滚动条 | 颜色 | #abc |
--radius-lg | 形状 | 圆角 | 0 |
--radius-md | 形状 | 圆角 | 0 |
--radius-sm | 形状 | 圆角 | 0 |
--radius-xl | 形状 | 圆角 | 0 |
--radius-xs | 形状 | 圆角 | 0 |
--sidebar-blur | 侧栏 | 长度 | 0 |
--sidebar-opacity | 侧栏 | 不透明度 | 0 |
--sidebar-panel-background | 侧栏 | 颜色 | #abc |
--sidebar-panel-background-active | 侧栏 | 颜色 | #abc |
--sidebar-panel-background-hover | 侧栏 | 颜色 | #abc |
--sidebar-panel-background-raised | 侧栏 | 颜色 | #abc |
--sidebar-panel-border-color | 侧栏 | 颜色 | #abc |
--sidebar-saturation | 侧栏 | 比率 | 0 |
--surface-sidebar | 侧栏 | 颜色 | #abc |
--slider-thumb-border-color | 滑动条 | 颜色 | #abc |
--slider-thumb-border-width | 滑动条 | 长度 | 0 |
--slider-thumb-color | 滑动条 | 颜色 | #abc |
--slider-thumb-height | 滑动条 | 长度 | 0 |
--slider-thumb-radius | 滑动条 | 圆角 | 0 |
--slider-thumb-width | 滑动条 | 长度 | 0 |
--slider-track-background | 滑动条 | 颜色 | #abc |
--slider-track-height | 滑动条 | 长度 | 0 |
--error | 状态 | 颜色 | #abc |
--success | 状态 | 颜色 | #abc |
--warning | 状态 | 颜色 | #abc |
--surface-accent-soft | 区域背景 | 颜色 | #abc |
--surface-accent-soft-strong | 区域背景 | 颜色 | #abc |
--surface-canvas | 区域背景 | 颜色 | #abc |
--surface-danger-soft | 区域背景 | 颜色 | #abc |
--surface-elevated | 区域背景 | 颜色 | #abc |
--surface-muted | 区域背景 | 颜色 | #abc |
--surface-muted-strong | 区域背景 | 颜色 | #abc |
--surface-panel | 区域背景 | 颜色 | #abc |
--surface-success-soft | 区域背景 | 颜色 | #abc |
--surface-toolbar | 区域背景 | 颜色 | #abc |
--surface-warning-soft | 区域背景 | 颜色 | #abc |
--text-inverse | 文字 | 颜色 | #abc |
--text-muted | 文字 | 颜色 | #abc |
--text-primary | 文字 | 颜色 | #abc |
--text-secondary | 文字 | 颜色 | #abc |
--toggle-background | 开关 | 颜色 | #abc |
--toggle-background-active | 开关 | 颜色 | #abc |
--toggle-radius | 开关 | 圆角 | 0 |
--toggle-thumb-color | 开关 | 颜色 | #abc |
--toggle-thumb-height | 开关 | 长度 | 0 |
--toggle-thumb-radius | 开关 | 圆角 | 0 |
--toggle-thumb-width | 开关 | 长度 | 0 |
--toggle-width | 开关 | 长度 | 0 |
--tooltip-background | 提示框 | 颜色 | #abc |
--tooltip-color | 提示框 | 颜色 | #abc |
--tooltip-font-size | 提示框 | 字号 | 18px |
--tooltip-radius | 提示框 | 圆角 | 0 |
--tooltip-shadow | 提示框 | 阴影 | none |
--font-interface-theme | 排版 | 字体栈 | 'Noto Serif SC', Georgia, serif |
--font-monospace-theme | 排版 | 字体栈 | 'Noto Serif SC', Georgia, serif |
--font-text-size | 排版 | 字号 | 18px |
--font-text-theme | 排版 | 字体栈 | 'Noto Serif SC', Georgia, serif |
--font-ui-large | 排版 | 字号 | 18px |
--font-ui-medium | 排版 | 字号 | 18px |
--font-ui-small | 排版 | 字号 | 18px |
--heading-spacing | 排版 | 长度 | 0 |
--line-height-normal | 排版 | 行高 | 1 |
--line-height-tight | 排版 | 行高 | 1 |
--p-spacing | 排版 | 长度 | 0 |
#取值约束
以下约束与应用内 AI 提示词来自同一份定义,长度按单位分别限制。
| 类型 | 约束 |
|---|---|
| 颜色 | 颜色:#RGB、#RGBA、#RRGGBB、#RRGGBBAA、transparent,或用逗号分隔参数的 rgb()/rgba()/hsl()/hsla()。统一保存为六位或八位十六进制,保留透明度。 |
| 圆角 | 圆角:0 或非负长度。各单位上限:32px / 2rem / 2em。 |
| 长度 | 长度:0 或非负长度。各单位上限:256px / 16rem / 16em。 |
| 字号 | 字号:0 或非负长度。各单位上限:64px / 4rem / 4em。 |
| 字重 | 字重:normal, bold, 100, 200, 300, 400, 500, 600, 700, 800, 900。 |
| 字形 | 字形:normal, italic, oblique。 |
| 字体栈 | 字体栈:最多 8 个已安装字体、500 个字符。不包含或下载字体文件。 |
| 不透明度 | 不透明度:0 到 1 的无单位数值。 |
| 比率 | 比率:0 到 3 的无单位数值。 |
| 行高 | 行高:1 到 3 的无单位数值。 |
| 时长 | 时长:使用 ms 或 s 的非负数值,最多 2000 ms。 |
| 缓动 | 缓动:linear, ease, ease-in, ease-out, ease-in-out,或 cubic-bezier(x1, y1, x2, y2)。x 的范围为 0–1,y 的范围为 -3–3。 |
| 阴影 | 阴影:none,或最多 4 层、500 个字符。每层依次为可选的 inset、x、y、可选的模糊和扩展长度、颜色。长度绝对值的各单位上限:256px / 16rem / 16em。模糊不能为负数。 |