--text-2xs
0.625rem / 1rem
Ayingott 设计系统展示
Typography
Typography tokens come from packages/theme/src/foundation/typography.css.
Font Families
| Token | Use |
|---|---|
--font-display | Page titles, nav, hero text, chips, compact UI labels |
--font-sans | Body copy and regular UI text |
--font-mono | Code, dates, metadata, technical labels |
--font-reading | Long-form reading body and headings |
With @ayingott/theme/fonts.css, all four roles use original LXGW WenKai for Chinese glyphs. Latin text retains Bricolage Grotesque, system UI, Space Mono, and Literata respectively. Without the opt-in import, the font stacks use available local/system fallbacks.
WenKai ships real 400 (Regular) and 500 (Medium) faces. Use font-medium for slightly heavier Chinese text; the theme's 600 / 700 tokens do not add real WenKai weights. See Fonts for a weight comparison and loading details.
Reading Leading
| Token | Value | Use |
|---|---|---|
--leading-reading | 1.7 | Long-form paragraph rhythm |
Type Scale
--text-xs
0.75rem / 1rem
Ayingott 设计系统展示
--text-sm
0.875rem / 1.25rem
Ayingott 设计系统展示
--text-base
1rem / 1.5rem
Ayingott 设计系统展示
--text-md
1.0625rem / 1.625rem
Ayingott 设计系统展示
--text-lg
1.125rem / 1.75rem
Ayingott 设计系统展示
--text-xl
1.25rem / 1.875rem
Ayingott 设计系统展示
--text-2xl
1.5rem / 2rem
Ayingott 设计系统展示
--text-3xl
1.875rem / 2.25rem
Ayingott 设计系统展示
--text-4xl
2.25rem / 2.5rem
Ayingott 设计系统展示
--text-5xl
3rem / 1.1
Ayingott 设计系统展示
--text-6xl
3.75rem / 1.05
Ayingott 设计系统展示
--text-7xl
4.5rem / 1
Ayingott 设计系统展示