hallmark 使用教程
从入门到精通的完整指南
hallmark 简介
Hallmark是一个专为AI编码助手设计的设计技能工具，致力于生成不带AI痕迹的专业UI界面。它将反AI千篇一律的设计共识——排版、配色、布局、动效和交互——编码为一个完整的设计规则集，由Together AI驱动。提供20种精心设计的主题风格（如Hum、Specimen、Midnight、Brutal等），每种主题都有独特的字体搭配和色彩系统。支持Claude Code、Cursor等主流AI编码工具，让AI生成的界面摆脱千篇一律的AI风格，呈现专业的设计品质。
详细功能介绍
【工具简介】Hallmark是一个为AI编码助手打造的设计技能，通过20种精心设计的主题风格，让AI生成的UI界面摆脱千篇一律的AI风格。
【核心功能】
① 20种主题风格：提供Hum、Specimen、Midnight、Brutal、Garden、Terminal等20种独特设计风格，每种都有专属字体和色彩系统
② 反AI风格设计：将排版、配色、布局、动效和交互的设计共识编码为规则集，系统性避免AI生成界面的千篇一律感
③ 字体系统集成：内置Google Fonts集成，为每种主题搭配专业的字体组合（如Inter、JetBrains Mono、Playfair Display等）
④ 主题实时切换：支持在20种主题间实时切换预览，通过键盘快捷键T快速循环切换
⑤ Together AI驱动：利用AI技术优化设计规则的应用效果
【适用场景】
【快速入门】
【优缺点分析】
优点：
缺点：
【适合人群】
1Hallmark 入门教程：让AI生成的UI界面摆脱千篇一律
入门10分钟
Hallmark是一个专为AI编码助手设计的设计技能工具，内置20种精心设计的主题风格，帮助AI生成不带AI痕迹的专业UI界面，告别千篇一律的AI风格设计。
快速开始：
1. 访问Hallmark项目仓库，查看支持的AI工具列表
2. 根据你使用的AI助手安装对应插件（Claude Code用户直接在技能列表中启用）
3. 在项目中创建 hallmark.config.json 配置文件
4. 选择一个主题风格，例如运行 hallmark theme list 查看所有可用主题
5. 使用 hallmark apply --theme hum 应用主题，即可在AI生成界面时自动使用该主题风格
核心功能演示：
功能一：主题风格选择与应用
Hallmark提供20种独特主题，每种主题都有专属的字体搭配、色彩系统和布局规范。输入 hallmark theme preview specimen 可以预览Specimen主题的效果，确认后运行 hallmark apply --theme specimen 即可应用。AI在生成UI代码时会自动遵循该主题的设计规范。
功能二：设计规则集自动生成
应用主题后，Hallmark会自动生成一套完整的设计规则文件，包括字体大小层级、颜色变量定义、间距规范、圆角设置、阴影效果等。这些规则会作为AI生成界面时的约束条件，确保输出的UI风格统一、专业。
功能三：反AI痕迹检测
内置反AI痕迹检测功能，运行 hallmark check 可以扫描已生成的界面代码，识别典型的AI设计特征（如过于均匀的间距、单调的渐变、缺乏层次的排版），并给出具体的修改建议，让界面更像人类设计师的作品。
实际使用案例：
场景一：产品官网设计
需要快速搭建一个产品官网，使用Hallmark的Midnight主题，AI生成的页面会采用深色背景、优雅的字体搭配和精致的动效，完全摆脱AI生成网站常见的塑料感，看起来像专业设计师的作品。
场景二：Dashboard管理后台
开发管理后台时应用Brutal主题，获得粗犷有力的设计风格，数据卡片、图表和表格组件都有独特的视觉特征，与常见的Bootstrap风格截然不同。
常见问题FAQ：
Q1：Hallmark支持哪些AI编码工具？
A：支持Claude Code、Cursor等主流AI编码助手，通过技能插件或配置文件集成。
Q2：能否自定义主题？
A：可以，Hallmark支持基于现有主题进行微调，修改配置文件中的颜色、字体等参数即可创建个性化主题。
Q3：生成的界面代码质量如何？
A：Hallmark生成的代码遵循现代前端最佳实践，支持响应式设计，代码结构清晰可维护。
小贴士：
1. 建议先用 hallmark theme preview 预览多个主题效果，再决定使用哪个
2. 不同项目可以使用不同主题，Hallmark支持按项目独立配置
3. 使用 hallmark check 定期检查界面代码，及时修正AI痕迹