本文仅保留 Geist 10 阶色板(sRGB 与 Display P3)及通用界面英文文案参考(如 Bot 首字母强调色取色等场景)。
注意:原 Geist 的字体(Geist Sans)、40px 默认控件尺寸、旧圆角/阴影/动效数值,以及旧 OKLCH 暗色体系均已被 Molibot 的 macOS 产品设计层替代并移除。当前界面的权威设计规范见 DESIGN.md,macOS 暗色语义角色见 design.dark.md,实际 token 定义见
apps/desktop/src/styles.css与apps/desktop/src/themes/。
每个非背景色阶包含 10 个梯度(100–1000),阶数表达语义意图而非单纯明度:
100默认背景 ·200悬停背景 ·300激活背景400默认边框 ·500悬停边框 ·600激活边框700高对比度实心填充 ·800实心填充悬停900次级文本与图标 ·1000主文本与图标
name: Geist Color Scales Reference
description: Light sRGB and Display P3 color scales retained as palette reference only.
colors:
primary: "#171717"
secondary: "#4d4d4d"
tertiary: "#006bff"
neutral: "#f2f2f2"
background-100: "#ffffff"
background-200: "#fafafa"
gray-100: "#f2f2f2"
gray-200: "#ebebeb"
gray-300: "#e6e6e6"
gray-400: "#eaeaea"
gray-500: "#c9c9c9"
gray-600: "#a8a8a8"
gray-700: "#8f8f8f"
gray-800: "#7d7d7d"
gray-900: "#4d4d4d"
gray-1000: "#171717"
gray-alpha-100: "#0000000d"
gray-alpha-200: "#00000015"
gray-alpha-300: "#0000001a"
gray-alpha-400: "#00000014"
gray-alpha-500: "#00000036"
gray-alpha-600: "#0000003d"
gray-alpha-700: "#00000070"
gray-alpha-800: "#00000082"
gray-alpha-900: "#000000b3"
gray-alpha-1000: "#000000e8"
blue-100: "#f0f7ff"
blue-200: "#e9f4ff"
blue-300: "#dfefff"
blue-400: "#cae7ff"
blue-500: "#94ccff"
blue-600: "#48aeff"
blue-700: "#006bff"
blue-800: "#0059ec"
blue-900: "#005ff2"
blue-1000: "#002359"
red-100: "#ffeeef"
red-200: "#ffe8ea"
red-300: "#ffe3e4"
red-400: "#ffd7d6"
red-500: "#ffb1b3"
red-600: "#ff676d"
red-700: "#fc0035"
red-800: "#ea001d"
red-900: "#d8001b"
red-1000: "#47000c"
amber-100: "#fff6de"
amber-200: "#fff4cf"
amber-300: "#fff1c1"
amber-400: "#ffdc73"
amber-500: "#ffc543"
amber-600: "#ffa600"
amber-700: "#ffae00"
amber-800: "#ff9300"
amber-900: "#aa4d00"
amber-1000: "#561900"
green-100: "#ecfdec"
green-200: "#e5fce7"
green-300: "#d3fad1"
green-400: "#b9f5bc"
green-500: "#82eb8d"
green-600: "#4ce15e"
green-700: "#28a948"
green-800: "#279141"
green-900: "#107d32"
green-1000: "#003a00"
teal-100: "#defffb"
teal-200: "#ddfef6"
teal-300: "#ccf9f1"
teal-400: "#b1f7ec"
teal-500: "#52f0db"
teal-600: "#00e3c4"
teal-700: "#00ac96"
teal-800: "#00927f"
teal-900: "#007f70"
teal-1000: "#003f34"
purple-100: "#faf0ff"
purple-200: "#f9f0ff"
purple-300: "#f6e8ff"
purple-400: "#f2d9ff"
purple-500: "#dfa7ff"
purple-600: "#c979ff"
purple-700: "#a000f8"
purple-800: "#8500d1"
purple-900: "#7d00cc"
purple-1000: "#2f004e"
pink-100: "#ffe8f6"
pink-200: "#ffe8f3"
pink-300: "#ffdfeb"
pink-400: "#ffd3e1"
pink-500: "#fdb3cc"
pink-600: "#f97ea7"
pink-700: "#f22782"
pink-800: "#e4106e"
pink-900: "#c41562"
pink-1000: "#460523"
# Wide-gamut accent variants in oklch for P3 displays
blue-100-p3: "oklch(97.32% 0.0141 251.56)"
blue-200-p3: "oklch(96.29% 0.0195 250.59)"
blue-300-p3: "oklch(94.58% 0.0293 249.84870859673202)"
blue-400-p3: "oklch(91.58% 0.0473 245.11621922481282)"
blue-500-p3: "oklch(82.75% 0.0979 248.48)"
blue-600-p3: "oklch(73.08% 0.1583 248.133320980386)"
blue-700-p3: "oklch(57.61% 0.2508 258.23)"
blue-800-p3: "oklch(51.51% 0.2399 257.85)"
blue-900-p3: "oklch(53.18% 0.2399 256.9900584162342)"
blue-1000-p3: "oklch(26.67% 0.1099 254.34)"
red-100-p3: "oklch(96.5% 0.0223 13.09)"
red-200-p3: "oklch(95.41% 0.0299 14.252646656611997)"
red-300-p3: "oklch(94.33% 0.0369 15.011509923860523)"
red-400-p3: "oklch(91.51% 0.0471 19.8)"
red-500-p3: "oklch(84.47% 0.1018 17.71)"
red-600-p3: "oklch(71.12% 0.1881 21.22)"
red-700-p3: "oklch(62.56% 0.2524 23.03)"
red-800-p3: "oklch(58.19% 0.2482 25.15)"
red-900-p3: "oklch(54.99% 0.232 25.29)"
red-1000-p3: "oklch(24.8% 0.1041 18.86)"
amber-100-p3: "oklch(97.48% 0.0331 85.79)"
amber-200-p3: "oklch(96.81% 0.0495 90.24227879900472)"
amber-300-p3: "oklch(95.93% 0.0636 90.52)"
amber-400-p3: "oklch(91.02% 0.1322 88.25)"
amber-500-p3: "oklch(86.55% 0.1583 79.63)"
amber-600-p3: "oklch(80.25% 0.1953 73.59)"
amber-700-p3: "oklch(81.87% 0.1969 76.46)"
amber-800-p3: "oklch(77.21% 0.1991 64.28)"
amber-900-p3: "oklch(52.79% 0.1496 54.65)"
amber-1000-p3: "oklch(30.83% 0.099 45.48)"
green-100-p3: "oklch(97.59% 0.0289 145.42)"
green-200-p3: "oklch(96.92% 0.037 147.15)"
green-300-p3: "oklch(94.6% 0.0674 144.23)"
green-400-p3: "oklch(91.49% 0.0976 146.24)"
green-500-p3: "oklch(85.45% 0.1627 146.3)"
green-600-p3: "oklch(80.25% 0.214 145.18)"
green-700-p3: "oklch(64.58% 0.1746 147.27)"
green-800-p3: "oklch(57.81% 0.1507 147.5)"
green-900-p3: "oklch(51.75% 0.1453 147.65)"
green-1000-p3: "oklch(29.15% 0.1197 147.38)"
teal-100-p3: "oklch(97.72% 0.0359 186.7)"
teal-200-p3: "oklch(97.06% 0.0347 180.66)"
teal-300-p3: "oklch(94.92% 0.0478 182.07)"
teal-400-p3: "oklch(92.76% 0.0718 183.78)"
teal-500-p3: "oklch(86.88% 0.1344 182.42)"
teal-600-p3: "oklch(81.5% 0.161 178.96)"
teal-700-p3: "oklch(64.92% 0.1572 181.95)"
teal-800-p3: "oklch(57.53% 0.1392 181.66)"
teal-900-p3: "oklch(52.08% 0.1251 182.93)"
teal-1000-p3: "oklch(32.11% 0.0788 179.82)"
purple-100-p3: "oklch(96.65% 0.0244 312.1890119359961)"
purple-200-p3: "oklch(96.73% 0.0228 309.8)"
purple-300-p3: "oklch(94.85% 0.0364 310.15)"
purple-400-p3: "oklch(91.77% 0.0614 312.82)"
purple-500-p3: "oklch(81.26% 0.1409 310.8)"
purple-600-p3: "oklch(72.07% 0.2083 308.19)"
purple-700-p3: "oklch(55.5% 0.3008 306.12)"
purple-800-p3: "oklch(48.58% 0.2638 305.73)"
purple-900-p3: "oklch(47.18% 0.2579 304)"
purple-1000-p3: "oklch(23.96% 0.13 305.66)"
pink-100-p3: "oklch(95.69% 0.0359 344.6218910697224)"
pink-200-p3: "oklch(95.71% 0.0321 353.14)"
pink-300-p3: "oklch(93.83% 0.0451 356.29)"
pink-400-p3: "oklch(91.12% 0.0573 358.82)"
pink-500-p3: "oklch(84.28% 0.0915 356.99)"
pink-600-p3: "oklch(74.33% 0.1547 0.24)"
pink-700-p3: "oklch(63.52% 0.238 1.01)"
pink-800-p3: "oklch(59.51% 0.2339 4.21)"
pink-900-p3: "oklch(53.5% 0.2058 2.84)"
pink-1000-p3: "oklch(26% 0.0977 359)"- 按钮命名:采用“动词 + 名词”(如
Delete Member/移除成员),避免仅写OK、Confirm或孤立动词。 - 错误文案:说明“发生了什么 + 下一步怎么处理”,而非内部异常栈。
- 轻提示 (Toast):直呼发生变更的对象,不加句号,不写冗余的
Successfully(如写Project deleted而非Successfully deleted the project.)。 - 空状态:一句话说明当前为空,并指向第一个可执行操作。
- 进行中状态:英文使用现在分词加省略号字符(
Saving…),中文使用“正在…”或明确阶段名称。