Hallmark Ft2 内联细线单行页脚用一条 hairline 规则收束整页的 Anti-Slop 设计范式【免费下载链接】hallmarkAnti-AI-slop design skill for Claude Code, Cursor, and Codex.项目地址: https://gitcode.com/GitHub_Trending/hal/hallmark本文是 Hallmarkskills/hallmark/SKILL.md组件原型的深度解读聚焦其八大页脚原型Ft1–Ft8中最克制的一支——Ft2 Inline-rule single line内联细线单行页脚。文中将拆解该原型的定义、适用场景、变体旋钮、Hallmark 令牌化实现、体裁路由规则以及它在site/css/tokens.css与站点自身页脚中的真实落地方式帮助你直接用这套手法终结千篇一律的四列导航页脚AI 指纹。Ft2 是什么一句话定义在skills/hallmark/references/components/ft2-inline-rule-single-line.md中Ft2 被定义为A single horizontal line of credits, address, copyright. Hairline rule above. No columns.即页脚只承载一行横向文本版权、地址、许可声明上方压一条 hairline发丝级分隔线没有任何分栏。它不导航、不站内地图、不陈列链接——它只是安静地告诉读者这页是谁、在哪一年、什么许可下做的。原型文档给出的规范结构只有一个footer加一个pfooter classfoot-line p© 2026 · 137 Marlow Street · MIT licensed/p /footer注意其中的信息组织方式版权符号 年份、地址、许可声明三项内容用·middot间隔符串联不需要列表、不需要 span 网格、不需要图标行。何时使用页面是编辑式的页脚是事后念头原型文档给出了一句使用判据Use when:the page is editorial and the footer is afterthought.两个条件缺一不可页面基调是编辑式的editorial——长文、杂志、期刊、studio 作品集、宣言页这类内容优先于导航的页面页脚是事后念头afterthought——页脚不是站点的导航终点而是正文结束后的一句收尾。页面越不把页脚当功能越适合 Ft2。反过来如果页面需要页脚承担导航职责文档站、索引页、多栏目站点那就应该选择 Ft3 Index-style category list 或 Ft1 Mast-headed而不是强行压成一行——这是路由表见下文的硬约束。不要与 Ft4 混淆原型文档专门标注了易混淆项Dont confuse with:Ft4 Dense typographic (which packs more in).对比两者Ft2 Inline single line一行内联文本规则之上无分栏。典型形态是© 2026 · 地址 · 许可。Ft4 Dense typographic见 components/ft4-dense-typographic.md一块大段小号等宽字体文本——版权、参考、许可、地址全部塞进一个 colophon 式段落可两端对齐或右散排是出版社版权页气质。其示例footer classfoot-dense mono pHallmark v0.2.0. Built with The Future, Fraunces, IBM Plex Mono. MIT licensed. Powered by Together AI. 137 Marlow Street, 2026./p /footer判断标准很简单信息是一行还是多行/多段。Ft2 追求一行说完Ft4 追求colophon 密度。变体旋钮同一个 Ft2 的三条可调轴原型文档本身只给出一个最小结构但组件总索引 component-cookbook.md 的Within-archetype variation knobs章节为 Ft2 定义了三条变体轴用于防止同一个原型造出同一个页脚旋钮取值Order顺序wordmark/links/credit · credit/wordmark/linksSeparator分隔符middot·· pipe|· em-dash—· vertical rule竖线Density密度dense紧凑· spaced宽松实战建议Order决定页脚的句法结构普通站点© 2026 · Studio Name · MIT更顺若 wordmark 想最后收尾则© 2026 · MIT · Studio。Separator是 Ft2 最容易被忽视的辨识点。默认·middot温和|pipe偏技术/终端—em-dash偏编辑式/或竖线偏品牌化。Density由字号与letter-spacing决定dense 用--text-xs配合--tracking-label类字距spaced 则放大--space-*留白。在输出时应把旋钮取值写进 macrostructure 印戳注释例如/* Hallmark · macrostructure: Long Document · Ft2 knobs: ordercredit/wordmark/links, separatormiddot, densityspaced · ... */令牌化实现让一行文本拥有系统级质感Ft2 的全部视觉权重在于那条hairline rule与一行文字的排版。Hallmark 强制locked tokens纪律见 anti-patterns.md § Mid-render token improvisation一切颜色与字体必须引用命名令牌禁止内联值。因此 Ft2 的 CSS 应这样写.foot-line { padding-block: var(--space-md) var(--space-lg); border-block-start: var(--rule-hair) solid var(--color-rule); color: var(--color-muted); font-size: var(--text-sm); }对应令牌在 site/css/tokens.css 中的定义Specimen 主题示例--rule-hair: 0.5px;——发丝线宽度令牌。注意它不是固定1px多数主题为0.5px而 Brutal、Manifesto、Sport 这类重边框主题会覆盖为1px--rule-fine甚至到2px/3px--color-rule: oklch(82% 0.014 75);——分隔线颜色随主题的纸张色paper变化保证线比纸深一点而不是突兀的黑边--color-muted: oklch(52% 0.012 65);——次要文字色用于版权行比正文弱一档--space-md: 1rem;、--space-lg: 1.5rem;——4pt 语义化间距刻度见 layout-and-space.md页脚上下留白应取自刻度而非手写 px。这种写法的两个收益换主题时页脚自动跟随新的线宽/线色/字号换项目时令牌体系可整体移植Hallmark 的 Build 步骤要求每个构建都产出tokens.css。体裁路由Ft2 在八种页脚中处于什么位置component-cookbook.md § Routing 给出了页脚与体裁的映射表体裁默认页脚也可用editorialFt1 Mast-headedFt2、Ft4、Ft6、Ft7modern-minimalFt2 Inline single lineFt1、Ft5atmosphericFt5 StatementFt1、Ft2playfulFt8 Marquee scrollFt5、Ft3terminalFt4 Dense colophonFt2docs / referenceFt3 Index columnsFt1关键结论Ft2 是 modern-minimal 体裁的默认页脚Stripe/Linear 那一派也是 editorial、atmospheric、terminal 三个体裁的合法备选——覆盖面非常广默认逃离 Ft3anti-patterns.md § The AI footer四列链接Product · Company · Resources · Legal 社交图标行 小版权行是AI 页脚指纹只有在真正的 hub/docs 根页且有真实站点地图时才允许 Ft3多样化规则同一会话内连续两次输出不得复用同一页脚原型——上一次用了 Ft2这一次必须在路由表也可用列中挑别的。响应式折叠Ft2 在窄屏的行为契约component-cookbook.md § Mobile collapse 为每个原型定义了双断点行为Ft2 的行60 rem~960px以下链接换行成多行分隔符退化为软换行soft return40 rem~640px以下整行折叠为纵向列表vertical list。实现上对应media (max-width: 40rem) { .foot-line p { display: flex; flex-direction: column; gap: var(--space-2xs); } }同时注意两条跨原型硬规则40rem 以下所有可点击目标 ≥ 44×44pxWCAG AA页内边距 ≥clamp(1rem, 4vw, 1.5rem)让单行版权文本在手机上不与屏幕边缘相切。仓库中的真实落地Hallmark 自己就是这么收尾的Ft2 并非纸上谈兵——Hallmark 自己的展示站点 site/index.html 的页脚实现与 Ft2 共享同一套视觉语言。其模板#footer-colophon第 999–1034 行使用foot--colophon结构而对应样式在 site/css/components.css 中.foot.foot--colophon { border-block-start: var(--rule-hair) solid var(--color-rule); /* components.css L3114 */ border-top-width: var(--rule-hair); } .foot__base { ... } /* L3301版权/许可行的底部区块 */站点页脚同样以border-block-start: var(--rule-hair) solid var(--color-rule)作为页脚的唯一顶部收束版权行为Made by Together AI. MIT licensed.——这正是 Ft2hairline rule above 单行版权信息结构的一种站级实例化证明了该令牌组合--rule-hair--color-rule muted 文字在真实主题切换系统22 个主题、[data-theme...]切换下的稳定性无论纸张是 Specimen 的暖燕麦色还是 Midnight 的深冷炭色发丝线与版权行都能跟随令牌自动适配。完整可运行示例综合原型结构、变体旋钮、令牌纪律与响应式行为一份符合 Hallmark 规范的 Ft2 最小实现如下footer classfoot-line rolecontentinfo p© 2026 · 137 Marlow Street · MIT licensed/p /footer/* 依赖 tokens.css--rule-hair / --color-rule / --color-muted / --text-sm / --space-* 均来自当前主题令牌块 */ .foot-line { padding-block: var(--space-md) var(--space-lg); border-block-start: var(--rule-hair) solid var(--color-rule); color: var(--color-muted); font-size: var(--text-sm); letter-spacing: var(--tracking-label); /* spaced 旋钮可移除此行 */ } media (max-width: 40rem) { .foot-line p { display: flex; flex-direction: column; gap: var(--space-2xs); } }对照 slop-test 门禁skills/hallmark/references/slop-test.md没有社交图标行、没有四列导航、没有浅灰背景块、没有多余包裹层——这就是 Ft2 之所以被视为反 AI 指纹页脚的原因它把页脚从复制来的导航冗余还原成了正文的最后一行排版。结语Ft2 Inline-rule single line 是 Hallmark 组件库中最少即是多的一页。掌握它的三个要点即可上手结构上坚持单行 hairline rule 无分栏选型上依托体裁路由表modern-minimal 默认、editorial/atmospheric/terminal 备选并在连续输出间轮换原型实现上全部引用--rule-hair、--color-rule、--color-muted与--space-*令牌让页脚跟随主题系统自动呼吸。当你下一次生成站点时把反射性的四列页脚替换成一行版权文字页面的人工感会立刻提升一个档次。【免费下载链接】hallmarkAnti-AI-slop design skill for Claude Code, Cursor, and Codex.项目地址: https://gitcode.com/GitHub_Trending/hal/hallmark创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考
Hallmark Ft2 内联细线单行页脚用一条 hairline 规则收束整页的 Anti-Slop 设计范式【免费下载链接】hallmarkAnti-AI-slop design skill for Claude Code, Cursor, and Codex.项目地址: https://gitcode.com/GitHub_Trending/hal/hallmark本文是 Hallmarkskills/hallmark/SKILL.md组件原型的深度解读聚焦其八大页脚原型Ft1–Ft8中最克制的一支——Ft2 Inline-rule single line内联细线单行页脚。文中将拆解该原型的定义、适用场景、变体旋钮、Hallmark 令牌化实现、体裁路由规则以及它在site/css/tokens.css与站点自身页脚中的真实落地方式帮助你直接用这套手法终结千篇一律的四列导航页脚AI 指纹。Ft2 是什么一句话定义在skills/hallmark/references/components/ft2-inline-rule-single-line.md中Ft2 被定义为A single horizontal line of credits, address, copyright. Hairline rule above. No columns.即页脚只承载一行横向文本版权、地址、许可声明上方压一条 hairline发丝级分隔线没有任何分栏。它不导航、不站内地图、不陈列链接——它只是安静地告诉读者这页是谁、在哪一年、什么许可下做的。原型文档给出的规范结构只有一个footer加一个pfooter classfoot-line p© 2026 · 137 Marlow Street · MIT licensed/p /footer注意其中的信息组织方式版权符号 年份、地址、许可声明三项内容用·middot间隔符串联不需要列表、不需要 span 网格、不需要图标行。何时使用页面是编辑式的页脚是事后念头原型文档给出了一句使用判据Use when:the page is editorial and the footer is afterthought.两个条件缺一不可页面基调是编辑式的editorial——长文、杂志、期刊、studio 作品集、宣言页这类内容优先于导航的页面页脚是事后念头afterthought——页脚不是站点的导航终点而是正文结束后的一句收尾。页面越不把页脚当功能越适合 Ft2。反过来如果页面需要页脚承担导航职责文档站、索引页、多栏目站点那就应该选择 Ft3 Index-style category list 或 Ft1 Mast-headed而不是强行压成一行——这是路由表见下文的硬约束。不要与 Ft4 混淆原型文档专门标注了易混淆项Dont confuse with:Ft4 Dense typographic (which packs more in).对比两者Ft2 Inline single line一行内联文本规则之上无分栏。典型形态是© 2026 · 地址 · 许可。Ft4 Dense typographic见 components/ft4-dense-typographic.md一块大段小号等宽字体文本——版权、参考、许可、地址全部塞进一个 colophon 式段落可两端对齐或右散排是出版社版权页气质。其示例footer classfoot-dense mono pHallmark v0.2.0. Built with The Future, Fraunces, IBM Plex Mono. MIT licensed. Powered by Together AI. 137 Marlow Street, 2026./p /footer判断标准很简单信息是一行还是多行/多段。Ft2 追求一行说完Ft4 追求colophon 密度。变体旋钮同一个 Ft2 的三条可调轴原型文档本身只给出一个最小结构但组件总索引 component-cookbook.md 的Within-archetype variation knobs章节为 Ft2 定义了三条变体轴用于防止同一个原型造出同一个页脚旋钮取值Order顺序wordmark/links/credit · credit/wordmark/linksSeparator分隔符middot·· pipe|· em-dash—· vertical rule竖线Density密度dense紧凑· spaced宽松实战建议Order决定页脚的句法结构普通站点© 2026 · Studio Name · MIT更顺若 wordmark 想最后收尾则© 2026 · MIT · Studio。Separator是 Ft2 最容易被忽视的辨识点。默认·middot温和|pipe偏技术/终端—em-dash偏编辑式/或竖线偏品牌化。Density由字号与letter-spacing决定dense 用--text-xs配合--tracking-label类字距spaced 则放大--space-*留白。在输出时应把旋钮取值写进 macrostructure 印戳注释例如/* Hallmark · macrostructure: Long Document · Ft2 knobs: ordercredit/wordmark/links, separatormiddot, densityspaced · ... */令牌化实现让一行文本拥有系统级质感Ft2 的全部视觉权重在于那条hairline rule与一行文字的排版。Hallmark 强制locked tokens纪律见 anti-patterns.md § Mid-render token improvisation一切颜色与字体必须引用命名令牌禁止内联值。因此 Ft2 的 CSS 应这样写.foot-line { padding-block: var(--space-md) var(--space-lg); border-block-start: var(--rule-hair) solid var(--color-rule); color: var(--color-muted); font-size: var(--text-sm); }对应令牌在 site/css/tokens.css 中的定义Specimen 主题示例--rule-hair: 0.5px;——发丝线宽度令牌。注意它不是固定1px多数主题为0.5px而 Brutal、Manifesto、Sport 这类重边框主题会覆盖为1px--rule-fine甚至到2px/3px--color-rule: oklch(82% 0.014 75);——分隔线颜色随主题的纸张色paper变化保证线比纸深一点而不是突兀的黑边--color-muted: oklch(52% 0.012 65);——次要文字色用于版权行比正文弱一档--space-md: 1rem;、--space-lg: 1.5rem;——4pt 语义化间距刻度见 layout-and-space.md页脚上下留白应取自刻度而非手写 px。这种写法的两个收益换主题时页脚自动跟随新的线宽/线色/字号换项目时令牌体系可整体移植Hallmark 的 Build 步骤要求每个构建都产出tokens.css。体裁路由Ft2 在八种页脚中处于什么位置component-cookbook.md § Routing 给出了页脚与体裁的映射表体裁默认页脚也可用editorialFt1 Mast-headedFt2、Ft4、Ft6、Ft7modern-minimalFt2 Inline single lineFt1、Ft5atmosphericFt5 StatementFt1、Ft2playfulFt8 Marquee scrollFt5、Ft3terminalFt4 Dense colophonFt2docs / referenceFt3 Index columnsFt1关键结论Ft2 是 modern-minimal 体裁的默认页脚Stripe/Linear 那一派也是 editorial、atmospheric、terminal 三个体裁的合法备选——覆盖面非常广默认逃离 Ft3anti-patterns.md § The AI footer四列链接Product · Company · Resources · Legal 社交图标行 小版权行是AI 页脚指纹只有在真正的 hub/docs 根页且有真实站点地图时才允许 Ft3多样化规则同一会话内连续两次输出不得复用同一页脚原型——上一次用了 Ft2这一次必须在路由表也可用列中挑别的。响应式折叠Ft2 在窄屏的行为契约component-cookbook.md § Mobile collapse 为每个原型定义了双断点行为Ft2 的行60 rem~960px以下链接换行成多行分隔符退化为软换行soft return40 rem~640px以下整行折叠为纵向列表vertical list。实现上对应media (max-width: 40rem) { .foot-line p { display: flex; flex-direction: column; gap: var(--space-2xs); } }同时注意两条跨原型硬规则40rem 以下所有可点击目标 ≥ 44×44pxWCAG AA页内边距 ≥clamp(1rem, 4vw, 1.5rem)让单行版权文本在手机上不与屏幕边缘相切。仓库中的真实落地Hallmark 自己就是这么收尾的Ft2 并非纸上谈兵——Hallmark 自己的展示站点 site/index.html 的页脚实现与 Ft2 共享同一套视觉语言。其模板#footer-colophon第 999–1034 行使用foot--colophon结构而对应样式在 site/css/components.css 中.foot.foot--colophon { border-block-start: var(--rule-hair) solid var(--color-rule); /* components.css L3114 */ border-top-width: var(--rule-hair); } .foot__base { ... } /* L3301版权/许可行的底部区块 */站点页脚同样以border-block-start: var(--rule-hair) solid var(--color-rule)作为页脚的唯一顶部收束版权行为Made by Together AI. MIT licensed.——这正是 Ft2hairline rule above 单行版权信息结构的一种站级实例化证明了该令牌组合--rule-hair--color-rule muted 文字在真实主题切换系统22 个主题、[data-theme...]切换下的稳定性无论纸张是 Specimen 的暖燕麦色还是 Midnight 的深冷炭色发丝线与版权行都能跟随令牌自动适配。完整可运行示例综合原型结构、变体旋钮、令牌纪律与响应式行为一份符合 Hallmark 规范的 Ft2 最小实现如下footer classfoot-line rolecontentinfo p© 2026 · 137 Marlow Street · MIT licensed/p /footer/* 依赖 tokens.css--rule-hair / --color-rule / --color-muted / --text-sm / --space-* 均来自当前主题令牌块 */ .foot-line { padding-block: var(--space-md) var(--space-lg); border-block-start: var(--rule-hair) solid var(--color-rule); color: var(--color-muted); font-size: var(--text-sm); letter-spacing: var(--tracking-label); /* spaced 旋钮可移除此行 */ } media (max-width: 40rem) { .foot-line p { display: flex; flex-direction: column; gap: var(--space-2xs); } }对照 slop-test 门禁skills/hallmark/references/slop-test.md没有社交图标行、没有四列导航、没有浅灰背景块、没有多余包裹层——这就是 Ft2 之所以被视为反 AI 指纹页脚的原因它把页脚从复制来的导航冗余还原成了正文的最后一行排版。结语Ft2 Inline-rule single line 是 Hallmark 组件库中最少即是多的一页。掌握它的三个要点即可上手结构上坚持单行 hairline rule 无分栏选型上依托体裁路由表modern-minimal 默认、editorial/atmospheric/terminal 备选并在连续输出间轮换原型实现上全部引用--rule-hair、--color-rule、--color-muted与--space-*令牌让页脚跟随主题系统自动呼吸。当你下一次生成站点时把反射性的四列页脚替换成一行版权文字页面的人工感会立刻提升一个档次。【免费下载链接】hallmarkAnti-AI-slop design skill for Claude Code, Cursor, and Codex.项目地址: https://gitcode.com/GitHub_Trending/hal/hallmark创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考
