Hallmark 中性色染色法则为什么暖强调色配冷灰就是不对【免费下载链接】hallmarkAnti-AI-slop design skill for Claude Code, Cursor, and Codex.项目地址: https://gitcode.com/GitHub_Trending/hal/hallmark如果你用过 AI 生成功能来写页面大概率见过这种说不出的难受强调色是暖橙色正文灰却是冷灰色整页看起来脏兮兮的。Hallmark 是一个面向 Claude Code、Cursor 和 Codex 的反 AI 味anti-AI-slop设计技能它的色彩规则集里专门写死了这条中性灰必须向锚点色相染色tint the greys。本文带你读懂 Hallmark 的中性色染色法则让你的页面配色从像模板变成像设计过的。一、先认识 Hallmark它管什么Hallmark 由 Together AI 出品本质上是一份设计纪律选宏观结构、套 22 套命名主题、跑 65 道 slop-test 门禁再拒绝所有大模型的默认审美。它的规则主体在 SKILL.md色彩细则单独成文在 color.md。核心立场多数 AI 生成的 UI 是败在颜色上的——默认选蓝、用纯黑纯白、紫到青的渐变、强调色铺满 30% 的页面。染色法则就是针对颜色不对味的第一道药。二、染色法则一句话版color.md 里的原话逻辑是如果你的锚点色相anchor hue是橙色你的中性色就该偏暖如果是蓝色就偏冷。暖强调色配冷灰正文的页面看起来就是不对而且大多数人说不清为什么不对。这就是法则的全部精神灰色不是中立的它是锚点色相的低浓度版本。人的视觉会把色温不一致识别成廉价感——就像暖光餐厅里突然开了一盏冷白灯。三、四层调色板染色发生在哪Hallmark 要求每页配色都有清晰的四层结构染色贯穿其中层级角色染色要求Paper纸面基底背景浅色模式 L 96–98%用锚点色相染chroma 0.005–0.015Ink墨色主文字浅色模式 L 16–22%同样向锚点色相染色Neutrals中性灰阶5–9 级分布在 Paper 和 Ink 之间每级都带锚点色相的低浓度染色Accent强调色唯一高饱和色chroma 0.12–0.22占视口≤3%只做高亮不做铺面关键点只允许 OKLCH感知均匀、明度可控因为hsl()和rgb()会骗你关于亮度的判断而染色是否均匀正是靠明度和色相一致性来保证的。四、三条配套禁令染色法则的边界color.md 的 Bans 一节把染色法则的反面也钉死了❌纯#000/#fff必须向锚点色相染一点 chroma❌零染色平灰chroma 为 0 的灰至少要加 0.005——这是 slop-test 明确拦截的flat grey❌紫青渐变、紫蓝渐变所有 LLM 都选它们直接禁用。五、真实案例看 token 文件里的染色长什么样仓库里的示例页面是最好的教材。NAJM摩洛哥时尚品牌走的是暖色系锚点是陶土橙oklch(58% 0.18 35)于是纸面、墨色、每一级灰都染了 55–78 的暖色相——强调色暖灰也暖整页对味。完整 token 见 najm/tokens.css--color-paper: oklch(96.5% 0.012 75)—— 纸面带 75° 暖色相--color-ink: oklch(20% 0.022 55)—— 墨色带 55° 暖色相--color-ink-mute: oklch(56% 0.012 60)—— 弱化文字也是暖的再看深色侧Wayfare旅行主题用暗暖纸面oklch(13% 0.010 60)配出血红强调色深色模式的灰阶依然全部带 60°–80° 暖色相见 wayfare/tokens.css。深色模式的额外规则色相永不换只动明度和浓度。六、如何在自己项目里执行这条法则不用装 Hallmark 也能照做三步即可定锚点先选一个强调色并转成 OKLCH记下它的色相比如橙色 ≈ 35染所有灰纸面、墨色、每一级分隔线/弱化文字灰色相都指向锚点chroma 压在 0.005–0.015 的低区间——浓度太低没味道太高就变成整页都是橙克制强调色强调色只给活跃导航、焦点环、链接下划线、CTA 边框绝不做大色块背景。如果你装了 Hallmark这套流程会被自动执行custom主题路线下custom-theme.md 的 §B 按锚点 → 纸面 → 墨色 → 辅助灰 → 焦点环的顺序逐层派生最后用 slop-test 门禁验证——无纯黑纯白Gate 8、无零染色中性色Gate 24、强调色占比不超 5%Gate 25。审计现有页面可以用hallmark audit直接跑一份点名报告。七、小结为什么这条法则值得记住灰色的温度决定了强调色是否融进页面而不是贴在页面上染色不是加滤镜而是用锚点色相统一所有中性层的 huechroma 保持极低配错时你说不出的难受本质就是色温断裂——现在你知道了。 延伸阅读完整色彩规则 color.md · 反 AI 味反模式清单 anti-patterns.md · 65 道门禁详解 slop-test.md【免费下载链接】hallmarkAnti-AI-slop design skill for Claude Code, Cursor, and Codex.项目地址: https://gitcode.com/GitHub_Trending/hal/hallmark创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 Hallmark 中性色染色法则：为什么暖强调色配冷灰就是不对
Hallmark 中性色染色法则为什么暖强调色配冷灰就是不对【免费下载链接】hallmarkAnti-AI-slop design skill for Claude Code, Cursor, and Codex.项目地址: https://gitcode.com/GitHub_Trending/hal/hallmark如果你用过 AI 生成功能来写页面大概率见过这种说不出的难受强调色是暖橙色正文灰却是冷灰色整页看起来脏兮兮的。Hallmark 是一个面向 Claude Code、Cursor 和 Codex 的反 AI 味anti-AI-slop设计技能它的色彩规则集里专门写死了这条中性灰必须向锚点色相染色tint the greys。本文带你读懂 Hallmark 的中性色染色法则让你的页面配色从像模板变成像设计过的。一、先认识 Hallmark它管什么Hallmark 由 Together AI 出品本质上是一份设计纪律选宏观结构、套 22 套命名主题、跑 65 道 slop-test 门禁再拒绝所有大模型的默认审美。它的规则主体在 SKILL.md色彩细则单独成文在 color.md。核心立场多数 AI 生成的 UI 是败在颜色上的——默认选蓝、用纯黑纯白、紫到青的渐变、强调色铺满 30% 的页面。染色法则就是针对颜色不对味的第一道药。二、染色法则一句话版color.md 里的原话逻辑是如果你的锚点色相anchor hue是橙色你的中性色就该偏暖如果是蓝色就偏冷。暖强调色配冷灰正文的页面看起来就是不对而且大多数人说不清为什么不对。这就是法则的全部精神灰色不是中立的它是锚点色相的低浓度版本。人的视觉会把色温不一致识别成廉价感——就像暖光餐厅里突然开了一盏冷白灯。三、四层调色板染色发生在哪Hallmark 要求每页配色都有清晰的四层结构染色贯穿其中层级角色染色要求Paper纸面基底背景浅色模式 L 96–98%用锚点色相染chroma 0.005–0.015Ink墨色主文字浅色模式 L 16–22%同样向锚点色相染色Neutrals中性灰阶5–9 级分布在 Paper 和 Ink 之间每级都带锚点色相的低浓度染色Accent强调色唯一高饱和色chroma 0.12–0.22占视口≤3%只做高亮不做铺面关键点只允许 OKLCH感知均匀、明度可控因为hsl()和rgb()会骗你关于亮度的判断而染色是否均匀正是靠明度和色相一致性来保证的。四、三条配套禁令染色法则的边界color.md 的 Bans 一节把染色法则的反面也钉死了❌纯#000/#fff必须向锚点色相染一点 chroma❌零染色平灰chroma 为 0 的灰至少要加 0.005——这是 slop-test 明确拦截的flat grey❌紫青渐变、紫蓝渐变所有 LLM 都选它们直接禁用。五、真实案例看 token 文件里的染色长什么样仓库里的示例页面是最好的教材。NAJM摩洛哥时尚品牌走的是暖色系锚点是陶土橙oklch(58% 0.18 35)于是纸面、墨色、每一级灰都染了 55–78 的暖色相——强调色暖灰也暖整页对味。完整 token 见 najm/tokens.css--color-paper: oklch(96.5% 0.012 75)—— 纸面带 75° 暖色相--color-ink: oklch(20% 0.022 55)—— 墨色带 55° 暖色相--color-ink-mute: oklch(56% 0.012 60)—— 弱化文字也是暖的再看深色侧Wayfare旅行主题用暗暖纸面oklch(13% 0.010 60)配出血红强调色深色模式的灰阶依然全部带 60°–80° 暖色相见 wayfare/tokens.css。深色模式的额外规则色相永不换只动明度和浓度。六、如何在自己项目里执行这条法则不用装 Hallmark 也能照做三步即可定锚点先选一个强调色并转成 OKLCH记下它的色相比如橙色 ≈ 35染所有灰纸面、墨色、每一级分隔线/弱化文字灰色相都指向锚点chroma 压在 0.005–0.015 的低区间——浓度太低没味道太高就变成整页都是橙克制强调色强调色只给活跃导航、焦点环、链接下划线、CTA 边框绝不做大色块背景。如果你装了 Hallmark这套流程会被自动执行custom主题路线下custom-theme.md 的 §B 按锚点 → 纸面 → 墨色 → 辅助灰 → 焦点环的顺序逐层派生最后用 slop-test 门禁验证——无纯黑纯白Gate 8、无零染色中性色Gate 24、强调色占比不超 5%Gate 25。审计现有页面可以用hallmark audit直接跑一份点名报告。七、小结为什么这条法则值得记住灰色的温度决定了强调色是否融进页面而不是贴在页面上染色不是加滤镜而是用锚点色相统一所有中性层的 huechroma 保持极低配错时你说不出的难受本质就是色温断裂——现在你知道了。 延伸阅读完整色彩规则 color.md · 反 AI 味反模式清单 anti-patterns.md · 65 道门禁详解 slop-test.md【免费下载链接】hallmarkAnti-AI-slop design skill for Claude Code, Cursor, and Codex.项目地址: https://gitcode.com/GitHub_Trending/hal/hallmark创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考