📚 设计Skill 全难度 📦 Nutlope

Hallmark

面向 Claude Code、Cursor 与 Codex 的开源设计 Skill，提供主题、设计动词、质量门禁和输出前自检

8.5 /10 ★★★★☆
#开源免费#设计#前端#海外

📊 评分明细

📦 打包完整度
2.1 2.1 / 2.5
🎯 实用性
2.1 2.1 / 2.5
📖 文档清晰度
1.7 1.7 / 2
👥 社区影响力
1.3 1.3 / 1.5
🔗 集成度
1.3 1.3 / 1.5

🎯 适用场景

开源免费设计前端海外

Hallmark 快速入门

这是什么？

Hallmark 是 Nutlope 开源的设计 Skill，面向 Claude Code、Cursor 和 Codex 等编码 Agent。它将界面设计约束、主题选择、审查动作与质量门禁整理为可复用的 Agent 指令。

2026-07-22 核实时，官方仓库采用 MIT 许可，约有 15.1K Stars。README 列出 20 个主题、build/audit/redesign/study 四类动作、57 项质量检查和输出前自我审查。

快速上手

克隆仓库并按官方说明把 Skill 安装到所用 Agent 的技能目录。先在独立分支或样例页面上运行，再审阅视觉和代码差异。

git clone https://github.com/Nutlope/hallmark.git

示例请求：

使用 Hallmark audit 审查这个页面，先列出问题和证据，不要修改代码。
使用 Hallmark redesign 给出两套方向，保持现有品牌色和无障碍要求。

常见踩坑

  • 把审美规则当成唯一标准，忽略产品品牌和真实用户需求。
  • 未检查 Agent 安装路径和当前工具是否真正加载了 Skill。
  • 一次性重写大量页面，导致难以审阅回归。
  • 只看视觉结果，不检查语义结构、可访问性和响应式行为。

参考链接

📊 评分与标签

核验口径：已按现行口径通过，待按新证据契约复核

评分说明

总分 8.5/10 · P_优选

📊 可观测社区指标（数据核验日期：2026-10-02）

  • GitHub: Nutlope/hallmark ★29,403，🔱1,513，MIT，创建 2026-04-27，最近提交 2026-08-06（无 tag / release）
  • 安装：npx skills add nutlope/hallmark；或把 SKILL.md 与 references/ 拷贝进 Claude Code、Cursor、Codex 的技能目录
  • 在线示例：usehallmark.com（十余个独立简报生成页，可对比不同主题与版式）

⚠️ 维度集说明：本条目归属 skills.json（skill 类型）。原文件误用 tool 六维度，2026-10-02 就地改为 skill 规范五维度（满分 2.5 / 2.5 / 2.0 / 1.5 / 1.5），条目未跨目录搬动。

📦 可安装性 2.2/2.5

  • npx skills add nutlope/hallmark 一行安装，可随时重跑更新；README 另行给出三个宿主 Agent 的手动落地路径（Claude Code 复制到 ~/.claude/skills/hallmark/、Cursor 转 .cursor/rules/hallmark.mdc、Codex 放 ~/.codex/skills/ 或项目内 .codex/skills/）
  • 纯文本规则，无运行时依赖、无需编译或服务端
  • 扣分：Cursor 需把 SKILL.md 正文转成 .mdc；仓库无 tag/release，缺少版本化分发与回滚手段
  • 对比通用设计系统组件库：组件库给零件，Hallmark 给「流程 + 门禁」

🎯 实用性 2.1/2.5

  • 二十一套主题 + 四类设计动作（默认构建、audit 审查、redesign 重构、study 取样）+ 五十七项 slop 门禁 + 输出前自检；Custom 分支可在无目录主题匹配时从零设计
  • 目标明确：拒绝「一眼 AI」的默认模板输出，减少常见模板化问题；官方示例页展示两个不同简报产出两套不同形态
  • 扣分：最终效果仍取决于宿主 Agent 对 Skill 的遵循程度与用户验收；未做本地实测
  • 对比 Webflow/Framer：模板与可视化更强，但 Hallmark 直接作用于代码产出，无需平台

📖 文档质量 1.6/2.0

  • README 结构完整：能力说明、四动词表、三平台安装、示例画廊、references 目录说明
  • 仓库 docs/ 含 recipes.md、study-examples.md、talk-slides.md；skills/hallmark/references/ 有 29 个文件（slop-test、macrostructures、themes、verbs、genres、custom-theme、typography、color 等）
  • 扣分：无独立文档站或 API 参考；references 本次仅做目录级核验，未逐篇通读
  • 对比同类设计 Skill：多数只有单个 SKILL.md；Hallmark 有成体系的分层参考文档

👥 社区活跃 1.4/1.5

  • 29,403 stars / 1,513 forks，规则集与 SKILL.md 持续更新，最近提交 2026-08-06
  • 归属 Together AI 维护，示例站持续扩充（含新增 Custom 分支）
  • 扣分：无 release/tag 记录；issue 响应速度与外部贡献者规模本次未核

🔗 兼容性 1.2/1.5

  • 官方声明支持 Claude Code、Cursor、Codex 三类编码 Agent，并分别给出安装位置；规则本身是纯文本，不绑定模型或运行时
  • 扣分：不同 Agent 对 Skill 的遵循程度不同；Cursor 需手动转换格式，属非一等支持
  • 对比 Agent 专属设计工具：Hallmark 跨三类主流 Agent 可用，深度集成度低于各平台原生产物

评分依据可追溯至公开来源，每项分数均有明确理由和数据支撑。

🏷️ 标签说明

  • 开源免费: MIT 许可，可用、可 Fork、可发布。来源：GitHub
  • 设计: 定位为反模板化的前端设计 Skill。来源：README
  • 前端: 产出为自包含 HTML + CSS 页面。来源：示例站
  • 海外: 由 Together AI 维护的英文项目。来源：GitHub

📋 来源与核验记录

  • ✅ GitHub API 实时核验（2026-10-02）: Nutlope/hallmark — stars 29,403 / forks 1,513 / MIT / 创建 2026-04-27 / 默认分支 main
  • ✅ README 实读（2026-10-02）: 四动词、21 主题、57 门禁、三平台安装路径、Custom 分支
  • ✅ 目录核验（2026-10-02）: references/ 29 个文件、docs/ 4 项（recipes.md、study-examples.md、talk-slides.md、screenshots）
  • ✅ 链接可达（2026-10-02）: usehallmark.com 示例站可访问
  • ⚠️ 未实测: 未在本地安装 Skill 跑通一次完整构建，产出质量以官方示例与 README 为准

⚠️ 局限与未实测声明

  • 本文基于 GitHub API、README 与仓库目录于 2026-10-02 采集；原记录「约 15.1K Stars」已由本次实时读数 29,403 替换
  • 未实测：未安装运行，未验证 57 项门禁的实际拦截效果
  • 格式修正说明：本条原按 tool 六维度给分（总分 8.5），2026-10-02 改为 skill 规范五维度，并按本次核验补齐「文档质量」维度证据（原文件该维度无任何证据原文）；维度和 2.2+2.1+1.6+1.4+1.2 = 8.5，与总分一致，标签 P_优选 不变