基础
主题
同一批组件、同一套 token,五种面貌。下面每一种都没有改动任何组件——各自只是根元素上的几个属性。
白色重置
系统出厂的样子。纸白底、细描边、衬线标题,强调色就是墨色。
Deploys
passing| Branch | Build |
|---|---|
| main | 2m 14s |
| codex/themes | 1m 02s |
大报
暖色纸、直角、明确的描边。报纸读起来是一张网格,不是一叠卡片。
Deploys
passing| Branch | Build |
|---|---|
| main | 2m 14s |
| codex/themes | 1m 02s |
控制台
冷色底、紧凑行距、干脆的动效、单一界面字体。密集操作界面要的全在这。
Deploys
passing| Branch | Build |
|---|---|
| main | 2m 14s |
| codex/themes | 1m 02s |
沙龙
大圆角、克制的描边,衬线一路用到正文。这是读的界面,不是干活的界面。
Deploys
passing| Branch | Build |
|---|---|
| main | 2m 14s |
| codex/themes | 1m 02s |
诊室
纸白底配单一无衬线,一点暖意都没有。圆角把它从“表单”里拉回来。
Deploys
passing| Branch | Build |
|---|---|
| main | 2m 14s |
| codex/themes | 1m 02s |
各项轴
预设只是这些轴的一种组合,而不是自成一块,所以没人做过的搭配你照样调得出来。
- 底色 — data-surface
- 纸白 · 暖白 · 冷白
- 圆角 — data-radius
- 直角 · 微圆 · 大圆
- 描边 — data-rules
- 克制 · 细线 · 明确
- 字体 — data-type
- 书刊 · 无衬线 · 通篇衬线
- 动效 — data-motion
- 静止 · 从容 · 利落
- 密度 — data-density
- 宽松 · 紧凑