TH-DS 2026-09-08

色彩体系

双重人格色彩系统：拥抱 纸张 的秩序和 霓虹 的混沌。

色值来自当前主题。比值将此色作为前景，与注明的背景比较；包含透明度合成与 sRGB 色域转换，不代表整页无障碍验收。

纸张系列 (Paper)

温暖、触感的浅色模式基底。

paper-0

var(--paper-0)

正在读取；若浏览器不支持，将不提供测量值。

paper-50

var(--paper-50)

正在读取；若浏览器不支持，将不提供测量值。

paper-100

var(--paper-100)

正在读取；若浏览器不支持，将不提供测量值。

paper-150

var(--paper-150)

正在读取；若浏览器不支持，将不提供测量值。

paper-200

var(--paper-200)

正在读取；若浏览器不支持，将不提供测量值。

碳素系列 (Carbon)

深邃、丰富的深色模式背景。

carbon-950

var(--carbon-950)

正在读取；若浏览器不支持，将不提供测量值。

carbon-900

var(--carbon-900)

正在读取；若浏览器不支持，将不提供测量值。

carbon-800

var(--carbon-800)

正在读取；若浏览器不支持，将不提供测量值。

carbon-700

var(--carbon-700)

正在读取；若浏览器不支持，将不提供测量值。

carbon-600

var(--carbon-600)

正在读取；若浏览器不支持，将不提供测量值。

carbon-500

var(--carbon-500)

正在读取；若浏览器不支持，将不提供测量值。

品牌与霓虹 (Brand & Neon)

核心标识与高能强调色。

brand-b700

var(--brand-b700)

正在读取；若浏览器不支持，将不提供测量值。

brand-b600

var(--brand-b600)

正在读取；若浏览器不支持，将不提供测量值。

brand-b500

var(--brand-b500)

正在读取；若浏览器不支持，将不提供测量值。

brand-b300

var(--brand-b300)

正在读取；若浏览器不支持，将不提供测量值。

brand-b200

var(--brand-b200)

正在读取；若浏览器不支持，将不提供测量值。

neon-teal-strong

var(--neon-teal-strong)

正在读取；若浏览器不支持，将不提供测量值。

neon-teal-soft

var(--neon-teal-soft)

正在读取；若浏览器不支持，将不提供测量值。

neon-cyan-strong

var(--neon-cyan-strong)

正在读取；若浏览器不支持，将不提供测量值。

neon-cyan-soft

var(--neon-cyan-soft)

正在读取；若浏览器不支持，将不提供测量值。

neon-magenta-strong

var(--neon-magenta-strong)

正在读取；若浏览器不支持，将不提供测量值。

neon-magenta-soft

var(--neon-magenta-soft)

正在读取；若浏览器不支持，将不提供测量值。

排版色彩

用于阅读层级的对比度定义。

text-strong

var(--text-strong)

正在读取；若浏览器不支持，将不提供测量值。

text-normal

var(--text-normal)

正在读取；若浏览器不支持，将不提供测量值。

text-muted

var(--text-muted)

正在读取；若浏览器不支持，将不提供测量值。

text-disabled

var(--text-disabled)

正在读取；若浏览器不支持，将不提供测量值。

暗色模式文本

carbon-text-strong

var(--carbon-text-strong)

正在读取；若浏览器不支持，将不提供测量值。

carbon-text-normal

var(--carbon-text-normal)

正在读取；若浏览器不支持，将不提供测量值。

carbon-text-muted

var(--carbon-text-muted)

正在读取；若浏览器不支持，将不提供测量值。

语义状态

用于反馈状态的功能色。

info

var(--info)

正在读取；若浏览器不支持，将不提供测量值。

success

var(--success)

正在读取；若浏览器不支持，将不提供测量值。

warning

var(--warning)

正在读取；若浏览器不支持，将不提供测量值。

danger

var(--danger)

正在读取；若浏览器不支持，将不提供测量值。

表面色

surface-info

var(--surface-info)

正在读取；若浏览器不支持，将不提供测量值。

surface-success

var(--surface-success)

正在读取；若浏览器不支持，将不提供测量值。

surface-warning

var(--surface-warning)

正在读取；若浏览器不支持，将不提供测量值。

surface-danger

var(--surface-danger)

正在读取；若浏览器不支持，将不提供测量值。

surface-brand

var(--surface-brand)

正在读取；若浏览器不支持，将不提供测量值。

数据可视化

用于图表和图形的分类色彩。

chart-1

var(--chart-1)

正在读取；若浏览器不支持，将不提供测量值。

chart-2

var(--chart-2)

正在读取；若浏览器不支持，将不提供测量值。

chart-3

var(--chart-3)

正在读取；若浏览器不支持，将不提供测量值。

chart-4

var(--chart-4)

正在读取；若浏览器不支持，将不提供测量值。

chart-5

var(--chart-5)

正在读取；若浏览器不支持，将不提供测量值。

玻璃拟态实验室 (Glass Lab)

基于背景模糊与透明度的物理材质。

磨砂玻璃背景模糊 + 半透明层

构造解剖 (Structural Anatomy)

用于构建组件物理边界的线条系统。

Item A
Item B
Item C