Design System · 03 Typography
Typography · 字体系统
文字即设计
大字号、强层级、极致留白——每屏只讲一件事。宋体负责讲故事,黑体负责把事办利索,英文与数字用几何无衬线拉开字距,书法体只在 slogan 落款处出现一次。
03 · 01
四个声部
Display · 讲故事
一饺包四季
现包吃不腻
思源宋体 SemiBold / Bold(Noto Serif SC 600/700)。标题、口号、章节名。字距 +0.02em,行高 1.3–1.5。只用于 ≥24px。
Text / UI · 办事
饺子皮选用中国绿色认证的新疆天山麦粉,年均 2800 小时日照;当日鲜蔬、当日做馅、当日现包、当日售卖。
思源黑体(Noto Sans SC 400/500/700)。正文、界面、说明文字。正文 15–17px,行高 1.8–2.0。
Latin & Numerals · 一等公民
1000+ STORES
FRESHLY HANDMADE
Outfit(几何无衬线)。英文与所有数字,字距略拉宽(+0.04–0.24em),数字用等宽数字(tabular-nums)。
Calligraphy · 仅落款
包好中国饺子
传承千年文化
书法体仅用于文化副线 slogan lockup(品牌表达场景),由题字原件以图片/矢量置入,不做系统字体。数字环境暂以思源宋 Black 代排。
03 · 02
字阶 · Type Ramp
以 1920 宽版面为基准;网页端按 clamp() 流式缩放,1080P 大屏下限 24px,印刷下限 12pt。
DisplaySerif 700 · 64–96px · lh 1.2
现包,是新鲜的手艺
H1Serif 700 · 44px · lh 1.35
从熊猫故乡出发
H2Serif 600 · 32px · lh 1.5
好肉 · 好面 · 好现包
H3Sans 700 · 21px · lh 1.6
智慧供应链:18 个中心仓,T+1 配送
BodySans 400 · 16px · lh 1.9
馅料与头部供应商合作,「明厨亮灶」可视化操作;面粉选用新疆天山绿色面粉。
CaptionSans 400 · 13px · lh 1.7
注:产品英文名以品牌手册 3.0 为准,误译处已标注待确认。
EyebrowOutfit 600 · 13px · ls 0.34em
Freshly Handmade Dumplings
03 · 03
数字是一等公民
品牌的证据都在数字里。数字永远用 Outfit,深底舞台上配雅金,单位与说明退后一档。
Data Stage 数据舞台 · 排版规格
数字 Outfit 600 · 48–72px · tabular-nums | 单位缩至 0.5 倍字号 | 说明 13.5px · 75% 透明度 | 一屏数字 ≤4 组
03 · 04
排版纪律
OUR CRAFT
当日现包,当日售卖
每一只饺子都来自当天的面皮与鲜馅。
Do一屏一件事:eyebrow → 标题 → 一句说明,三层封顶。
当日现包!当日售卖!
每一只饺子都来自当天的面皮与鲜馅!
好肉好面好现包,三好原则值得信赖!!
更多惊喜等你发现,快来加盟吧~
Don't层级挤压、彩色标题、下划线强调、感叹号堆叠——热闹但廉价。
中文标题字距 +0.02em
英文 eyebrow 字距 0.24–0.34em
正文行长 ≤ 38 字
标点悬挂,避头尾
中西文之间留 1/4 空格
禁斜体中文 · 禁双重强调