TYPOGRAPHY
巨号展示标题Display Heading
80-160px 的超大字重标题，tight 字距 + tight 行高——纯排版立起来的画面。
效果预览
把时间
还给创造
font-size: clamp(56px, 10vw, 148px)还给创造
weight: 800 · tracking: -0.04em · lh: 1.04
适合用在哪
首屏主标题、章节大标题、品牌宣言。
容易踩的坑
- 字号写死 160px 不用 clamp()，375px 手机上一个英文长词就撑破视口横向滚动。
- 手动 <br> 断行在窄屏上会变成三四行参差断句，应配合媒体查询或 balance。
- 大标题用图片或 SVG 文字实现，搜索引擎和读屏都读不到页面主题。
设计提示词 · Prompt
巨号展示标题（Display Heading）：72-160px、字重 750-850、letter-spacing:-0.04em（字号越大字距越紧）、line-height:1.02-1.08。字体选 Display 类（衬线或几何无衬线均可），正文绝不用同字号。两行以上时手动断行（<br>）控制节奏，每行 2-6 个词。中英文混排时中文用系统黑体加粗、英文用同家族 Display，视觉字重对齐。让一个词做渐变/斜体/衬线强调制造焦点。CSS 端配合 text-wrap:balance 自动平衡两行。标题的字号要占到视口宽度的 8-12%。
Display Heading: 72-160px, weight 750-850, letter-spacing:-0.04em (the larger the size, the tighter the tracking), line-height:1.02-1.08. Choose a Display typeface (serif or geometric sans both work); never use the same size for body text. For two or more lines, break lines manually (<br>) to control rhythm, 2-6 words per line. In mixed Chinese/English, use the system sans-serif in bold for Chinese and the same Display family for English, matching visual weight. Let one word carry a gradient/italic/serif emphasis to create a focal point. On the CSS side, pair with text-wrap:balance to auto-balance two lines. The heading's size should be 8-12% of the viewport width.
常见搭配
同一页面里经常和「巨号展示标题」一起出现的模式，可以收藏后用「组合收藏为整页提示词」一起交给 AI。
演示 HTML 结构
<div class="s d-typedisp"> <div class="d-typedisp__big">把时间<br>还给创造</div> <span class="d-typedisp__spec">font-size: clamp(56px, 10vw, 148px)<br>weight: 800 · tracking: -0.04em · lh: 1.04</span> </div>