来自 GitHub Primer 的设计 token
颜色不写在任何地方的行内。_variables.scss 声明 Primer 的浅色值，深色块重新声明同名 变量。
token 为什么重要
组件只会引用语义化 token。换掉整套配色只是改一个文件。
token 集合
| Token | 浅色 | 深色 |
|---|---|---|
--github-canvas-default | #ffffff | #0d1117 |
--github-canvas-subtle | #f6f8fa | #151b23 |
--github-border-default | #d0d7de | #3d444d |
--github-fg-default | #1f2328 | #f0f6fc |
1
声明浅色值
Primer 的浅色配色写在
:root 里。2
在深色里覆盖
html[data-theme='dark'] 重新声明每一个会变化的 token。3
使用语义化命名
组件引用 token，永远不引用十六进制色值。