文字-Typography
    截屏2022-07-14 18.07.08.png
    用于控制对齐(alignment),封装(wrapping),以及字重(weight)等等的常用文本实用辅助工具的文档和示例。
    文本对齐(Text alignment)
    字重(weight)
    字体大小(Font size)
    中英文的字形高度对比:

    截屏2022-07-14 15.35.32.png
    tips:同样的字体、字号、字重,中文字形要大于英文。

    元素 尺寸
    标题(页面或模态) 16pt 中等字体粗细
    iOS 10+ 页面标题在滚动前为 34pt,滚动后为 17pt
    段落文本,链接 16pt
    次要文本 14pt 颜色也比较浅
    第三文本、字幕、分段按钮 12pt 跳过二级和三级文本之间的字体大小
    表单控件(按钮、文本输入) 16pt 突出显示中等字体粗细的重要按钮
    标签栏、操作栏 10pt 不要比这个小
    ArcUI 内px与rem的尺寸换算关系(x/50)
    ArcUI-rem px
    1 0.02 1px
    2 0.04 2px
    3 0.06 3px
    4 0.08 4px
    5 0.1 5px
    6 0.12 6px
    7 0.16 8px
    8 0.2 10px
    9 0.24 12px text-xs
    10 0.26 13px
    11 0.28 14px text-sm
    12 0.3 15px
    13 0.32 16px text-base
    14 0.36 18px text-lg
    15 0.4 20px text-xl
    16 0.48 24px text-2xl
    17 0.5 25px
    18 0.56 28px text-3xl
    19 0.64 32px
    20 0.72 36px text-4xl
    21 0.8 40px
    22 0.88 44px
    23 0.96 48px text-5xl
    24 1 50px
    25 1.12 56px

    标签栏文字:9-10pt(中文最小9、英文最小10)

    列表项文本

    1. 主要文本(16pt 常规)
    2. 主要文本(16pt 常规)和辅助文本(14pt 常规)
    3. 自定义布局 - 例如主要文本(16pt 常规)、辅助文本(14pt 常规但更轻)和第三文本(154常规但更轻)

    当用户尚未滚动(或滚动,但随后又滚动回顶部)时:

    • 尺寸:34pt
    • 字体粗细:粗体
    • 颜色:#000
    • 深色模式颜色:#FFF
    • 对齐方式:左

    当用户向下滚动时

    • 尺寸:17pt
    • 字体粗细:中等
    • 颜色:#030303
    • 深色模式颜色:#FFF
    • 对齐方式:居中

    iPhone 应用程序的默认文本样式
    iPhone 应用程序上文本的“默认样式”是:

    • 尺寸:17pt
    • 字体粗细:正常
    • 颜色:#000
    • 深色模式颜色:#FFF

    iPhone 应用程序的辅助文本样式
    iPhone 应用程序对任何支持的“辅助”文本都有标准化的样式。

    • 尺寸:15pt
    • 字体粗细:正常
    • 颜色:#8A8A8E
    • 深色模式颜色:#8D8D93

    iPhone 应用程序的三级文本和字幕样式
    任何解释性“标题”都比辅助文本更小、更轻。

    • 尺寸:13pt
    • 字体粗细:正常
    • 颜色:#6D6D72
    • 深色模式颜色:#8D8D93

    iPhone 应用程序上的最小文本大小
    对于任何设计系统,只需定义一个最小尺寸就可以省去很多麻烦。对于 iPhone 应用程序,这是 10pt 处的操作栏标签:

    • 尺寸:10pt
    • 字体粗细:正常
    • 颜色:#999(未选择时)
    • 深色模式颜色:#757575(未选中时)