type-systems

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

Type Systems

排版系统

Typography is a system. Every decision should be intentional and connected.
排版是一套系统。每一个决策都应具备目的性且相互关联。

How to use

使用方法

  • /type-systems
    Apply type system constraints to this conversation.
  • /type-systems
    在此对话中应用排版系统约束。

Constraints

约束规则

Scale

字号比例

  • MUST use a mathematical ratio for the type scale (1.25, 1.333, 1.5 between sizes)
  • Wide range (12px to 72px): dramatic hierarchy, suits editorial and marketing
  • Narrow range (14px to 24px): subtle hierarchy, suits dense products
  • NEVER use random sizes. If it's not on the scale, it shouldn't exist.
  • MUST limit to 4-6 sizes per screen maximum with clear justification for each
  • 必须为字号层级使用数学比例(字号间比例为1.25、1.333或1.5)
  • 宽范围(12px至72px):层级对比强烈,适合编辑类内容和营销场景
  • 窄范围(14px至24px):层级对比柔和,适合信息密度高的产品
  • 绝对禁止使用随机字号。若字号不在层级内,则不应出现。
  • 每个页面最多只能使用4-6种字号,且每种字号都要有明确的使用理由

Weight

字重

  • 1-2 weights: discipline. Hierarchy comes from scale and space, not weight.
  • 3 weights: normal range. Regular body, medium emphasis, bold headlines.
  • 4+ weights: either the system demands it or you haven't made a decision.
  • MUST ensure each weight serves a distinct, named purpose
  • 1-2种字重:保持克制。层级区分依赖字号和间距,而非字重。
  • 3种字重:常规范围。正文用常规字重,强调内容用中等字重,标题用粗体。
  • 4种及以上字重:要么是系统确实需要,要么是你尚未做出明确决策。
  • 必须确保每种字重都有明确的、已命名的用途

Line Height

行高

  • Body text: 1.5-1.7x font size. Where readability lives.
  • Headlines: 1.1-1.3x. Large text has built-in breathing room.
  • UI labels: 1.2-1.4x. Compact but not crushed.
  • NEVER use the same line height for all text sizes
  • 正文:字号的1.5-1.7倍。这是保证可读性的关键区间。
  • 标题:字号的1.1-1.3倍。大字号本身已自带足够的呼吸空间。
  • UI标签:字号的1.2-1.4倍。紧凑但不拥挤。
  • 绝对禁止所有文本使用相同的行高

Letter Spacing

字距

  • Body text: leave it alone. The type designer already optimized it.
  • All-caps labels: add 2-5% tracking. Capitals need air.
  • Large display text (72px+): sometimes benefits from tightening.
  • 正文:保持默认即可。字体设计师已对其进行过优化。
  • 全大写标签:增加2-5%的字距。大写字母需要更多呼吸空间。
  • 大尺寸展示文本(72px及以上):有时收紧字距会效果更好。

Anti-Patterns

反模式

  • More than 3 type sizes on a single screen without clear hierarchy justification
  • Centering paragraphs longer than 3 lines
  • Lines over 75 characters wide (hurts readability)
  • Inconsistent weight usage with no system behind it
  • 单个页面使用超过3种字号却无明确的层级区分理由
  • 超过3行的段落使用居中对齐
  • 行宽超过75个字符(会损害可读性)
  • 字重使用不一致且无系统规则支撑