Hallmark Hero 标题长度与字号钳制关系4 档自动降档规则完整指南【免费下载链接】hallmarkAnti-AI-slop design skill for Claude Code, Cursor, and Codex.项目地址: https://gitcode.com/GitHub_Trending/hal/hallmarkHallmark是一个面向 Claude Code、Cursor 和 Codex 的 Anti-AI-slop 设计技能design skill它会拒绝一切一眼 AI 味的默认审美。而在它的排版规则体系里最实用的一条就是Hero 标题长度与字号的钳制关系AI 写出的 Hero 大标题会先数清字符数再按 4 个档位自动选择字号上限超长标题自动降档——这正是 Hallmark 生成的页面看起来不像模板的关键细节之一。为什么字号要跟着标题长度走在 AI 生成的页面里一条 100 字符的标题配 display 级超大字号是最可靠的 AI 破绽AI tell之一。它会在 1280–1440px 的视口里挤成一团换行后又读起来像戏剧感而非分量感。Hallmark 的解法不是让你手动调字号而是把这条规则写进了技能规则集AI 在构建 Hero 时先统计渲染出的h1字符数再对照档位表选字号上限。这条规则叠加在任何主题自己的--text-displayclamp 之上相当于给字号加了一道长度阀门。规则原文位于 typography.md 的 Hero headline sizing 一节并在 SKILL.md 的 Build 步骤中被列为强制项。4 档自动降档规则速查表Hallmark 把 Hero 标题分成4 个长度档位每档对应一个字号上限标题长度字号上限说明≤ 20 字符如Limitless完整--text-display单词标题可放大到 7rem仅限 display 风格强烈的主题21–50 字符默认甜点区--text-display若 414px 宽度下换行超过 2 行降一档到--text-display-s51–90 字符封顶--text-display-s强烈建议拆成 eyebrow headline 90 字符重写得短或封顶--text-4xl并收紧行高100 字符标题 display 字号 最典型的 AI 味可以看到降档是渐进的从完整 display 字号 → display-s → text-4xl档位越靠后字号越小、行高越紧。50 字符是整条规则的中轴线——Hallmark 默认推荐你写的标题就落在 21–50 字符这个甜点区。以 TallySaaS 示例这类标准商业页面为例Hero 标题正好落在甜点区字号停在--text-display档既不显小气也不溢出激进展示主题 50 字符再降一档Brutal、Riso、Manifesto 这几类激进展示型主题的--text-display被钳制在 6.5–9rem——这个天花板只适用于 ≤ 50 字符的短句。标题一旦超过 50 字符这些主题会自动路由到--text-display-s整体再降一档。也就是说激进主题实际上是双重钳制主题自己钳一次长度规则再钳一次。这解释了为什么 Hallmark 的短标题示例敢把字号推到 7rem单词且 ≤ 12ch 的特例上限而长标题永远温顺得多字号令牌clamp 背后的真实数值降档的目标令牌定义在 Hallmark 官网的 tokens.css 中采用 CSSclamp()实现最小值 视口弹性 最大值的响应式钳制--text-display: clamp(3.0rem, 5.5vw 1.0rem, 5.75rem); /* 上限约 92px */ --text-display-s: clamp(2rem, 3vw 1rem, 3rem); /* 降档档上限 48px */降档的幅度是实实在在的从 display 到 display-s上限直接从 ~92px 掉到 48px降幅接近一半。而 typography 规则同时规定 display 字号不得超过 5.5rem88px——超过这个值标题在桌面视口里只会自我挤压。最佳实践从源头控制长度与其让标题撞线后被动降档Hallmark 更推荐一开始就写短自己撰写标题非用户提供的文案时目标≤ 7 个词、≤ 50 字符用祈使句或名词短语开头永远不要用动名词-ing开头标题 50 字符时优先考虑拆成 eyebrow headline 两行结构而不是硬塞进一个大字号里整页最多使用 5 种字号——需要更多层级时用字重和颜色而不是再加一个尺寸。Wayfare 这类旅行页面的 Hero 就是按这套规则产出的结果标题长度受控、字号稳在甜点档视觉重心落在氛围而非文字堆叠上规则出处相关文件路径一览内容路径4 档降档规则原文typography.mdBuild 步骤强制项SKILL.md字号令牌定义tokens.css输出前 65 项 slop 测试门禁slop-test.md更多 Hero 构建细节hero-enrichment.md小结Hallmark 的 Hero 标题钳制关系可以浓缩成一句话数清字符对号入座超长自动降档。≤ 20 字符放开用、21–50 字符是默认甜点区、51–90 字符封顶 display-s、超过 90 字符直接重写——再叠加激进主题的 50 字符二次钳制保证任何输出都不会出现超大字号 长标题的 AI 招牌破绽。掌握了这条规则你写 brief 时就能反过来指导 AI 生成更克制的标题了 【免费下载链接】hallmarkAnti-AI-slop design skill for Claude Code, Cursor, and Codex.项目地址: https://gitcode.com/GitHub_Trending/hal/hallmark创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考