Semantic / 排版
Document Typography
用于标题、导语、正文、标签和说明。
展示
系统样例
document.headingXL界面文字需要清楚、稳定，并适合连续阅读。Interface text stays clear at every size.
- 字号
clamp(2rem, 3vw, 2.5rem)- 字重
- 700
- 行高
- 1.2
- 字距
-0.025em
document.headingL界面文字需要清楚、稳定，并适合连续阅读。Interface text stays clear at every size.
- 字号
2rem- 字重
- 700
- 行高
- 1.2
- 字距
-0.025em
document.headingM界面文字需要清楚、稳定，并适合连续阅读。Interface text stays clear at every size.
- 字号
1.5rem- 字重
- 600
- 行高
- 1.2
- 字距
-0.025em
document.headingS界面文字需要清楚、稳定，并适合连续阅读。Interface text stays clear at every size.
- 字号
1.25rem- 字重
- 600
- 行高
- 1.2
- 字距
0
document.title界面文字需要清楚、稳定，并适合连续阅读。Interface text stays clear at every size.
- 字号
1.125rem- 字重
- 600
- 行高
- 1.35
- 字距
0
document.lead界面文字需要清楚、稳定，并适合连续阅读。Interface text stays clear at every size.
- 字号
1.25rem- 字重
- 400
- 行高
- 1.6
- 字距
0
document.body界面文字需要清楚、稳定，并适合连续阅读。Interface text stays clear at every size.
- 字号
1rem- 字重
- 400
- 行高
- 1.6
- 字距
0
document.ui界面文字需要清楚、稳定，并适合连续阅读。Interface text stays clear at every size.
- 字号
0.875rem- 字重
- 500
- 行高
- 1.35
- 字距
0
document.label界面文字需要清楚、稳定，并适合连续阅读。Interface text stays clear at every size.
- 字号
0.8125rem- 字重
- 600
- 行高
- 1.35
- 字距
0.04em
document.caption界面文字需要清楚、稳定，并适合连续阅读。Interface text stays clear at every size.
- 字号
0.8125rem- 字重
- 400
- 行高
- 1.35
- 字距
0
document.micro界面文字需要清楚、稳定，并适合连续阅读。Interface text stays clear at every size.
- 字号
0.75rem- 字重
- 400
- 行高
- 1.35
- 字距
0
Token
1 个分类
| 名称 | 类型 | 浅色 | 深色 | 预览 |
|---|---|---|---|---|
semantic.typography.document.headingXL.size一级文档标题 | dimension | clamp(2rem, 3vw, 2.5rem) | clamp(2rem, 3vw, 2.5rem) | Aa |
semantic.typography.document.headingXL.weight一级文档标题 | fontWeight | 700 | 700 | Aa |
semantic.typography.document.headingXL.leading一级文档标题 | number | 1.2 | 1.2 | Aa |
semantic.typography.document.headingXL.tracking一级文档标题 | dimension | -0.025em | -0.025em | Aa |
semantic.typography.document.headingL.size二级文档标题 | dimension | 2rem | 2rem | Aa |
semantic.typography.document.headingL.weight二级文档标题 | fontWeight | 700 | 700 | Aa |
semantic.typography.document.headingL.leading二级文档标题 | number | 1.2 | 1.2 | Aa |
semantic.typography.document.headingL.tracking二级文档标题 | dimension | -0.025em | -0.025em | Aa |
semantic.typography.document.headingM.size三级文档标题 | dimension | 1.5rem | 1.5rem | Aa |
semantic.typography.document.headingM.weight三级文档标题 | fontWeight | 600 | 600 | Aa |
semantic.typography.document.headingM.leading三级文档标题 | number | 1.2 | 1.2 | Aa |
semantic.typography.document.headingM.tracking三级文档标题 | dimension | -0.025em | -0.025em | Aa |
semantic.typography.document.headingS.size四级文档标题 | dimension | 1.25rem | 1.25rem | Aa |
semantic.typography.document.headingS.weight四级文档标题 | fontWeight | 600 | 600 | Aa |
semantic.typography.document.headingS.leading四级文档标题 | number | 1.2 | 1.2 | Aa |
semantic.typography.document.headingS.tracking四级文档标题 | dimension | 0 | 0 | Aa |
semantic.typography.document.title.size内容标题 | dimension | 1.125rem | 1.125rem | Aa |
semantic.typography.document.title.weight内容标题 | fontWeight | 600 | 600 | Aa |
semantic.typography.document.title.leading内容标题 | number | 1.35 | 1.35 | Aa |
semantic.typography.document.title.tracking内容标题 | dimension | 0 | 0 | Aa |
semantic.typography.document.lead.size导语 | dimension | 1.25rem | 1.25rem | Aa |
semantic.typography.document.lead.weight导语 | fontWeight | 400 | 400 | Aa |
semantic.typography.document.lead.leading导语 | number | 1.6 | 1.6 | Aa |
semantic.typography.document.lead.tracking导语 | dimension | 0 | 0 | Aa |
semantic.typography.document.body.size正文 | dimension | 1rem | 1rem | Aa |
semantic.typography.document.body.weight正文 | fontWeight | 400 | 400 | Aa |
semantic.typography.document.body.leading正文 | number | 1.6 | 1.6 | Aa |
semantic.typography.document.body.tracking正文 | dimension | 0 | 0 | Aa |
semantic.typography.document.ui.size界面文字 | dimension | 0.875rem | 0.875rem | Aa |
semantic.typography.document.ui.weight界面文字 | fontWeight | 500 | 500 | Aa |
semantic.typography.document.ui.leading界面文字 | number | 1.35 | 1.35 | Aa |
semantic.typography.document.ui.tracking界面文字 | dimension | 0 | 0 | Aa |
semantic.typography.document.label.size标签 | dimension | 0.8125rem | 0.8125rem | Aa |
semantic.typography.document.label.weight标签 | fontWeight | 600 | 600 | Aa |
semantic.typography.document.label.leading标签 | number | 1.35 | 1.35 | Aa |
semantic.typography.document.label.tracking标签 | dimension | 0.04em | 0.04em | Aa |
semantic.typography.document.caption.size说明 | dimension | 0.8125rem | 0.8125rem | Aa |
semantic.typography.document.caption.weight说明 | fontWeight | 400 | 400 | Aa |
semantic.typography.document.caption.leading说明 | number | 1.35 | 1.35 | Aa |
semantic.typography.document.caption.tracking说明 | dimension | 0 | 0 | Aa |
semantic.typography.document.micro.size微型说明 | dimension | 0.75rem | 0.75rem | Aa |
semantic.typography.document.micro.weight微型说明 | fontWeight | 400 | 400 | Aa |
semantic.typography.document.micro.leading微型说明 | number | 1.35 | 1.35 | Aa |
semantic.typography.document.micro.tracking微型说明 | dimension | 0 | 0 | Aa |
使用
使用规则
- 页面和组件通过语义或组件 Token 使用这些值。
- 不要在页面中复制原始值。
- 浅色和深色主题分别检查实际组合。