开始 · START

给 Agent 用 For Agents

这个站的每一页都有机读版本。本页说明入口在哪、按什么顺序读、Markdown 头里的字段是什么意思，以及复刻完怎么自检。

入口

地址	是什么	什么时候用
`/llms.txt`	全站目录，按 llms.txt 约定书写，每条链接指向对应页面的 .md	第一站
`/llms-full.txt`	全站所有页面的 Markdown 拼成一个文件	想一次读完
`/DESIGN.md`	单文件规范：YAML 头放令牌与组件参数，正文放原则与铁律	只能读一个文件时
`/tokens.json`	W3C 设计令牌（DTCG）格式，数值直接读自 tokens.css	导入设计工具或生成主题
`/zzm.css`	全部样式合成一个文件（.zzm-v4 作用域）	静态页、任何技术栈
`/zzm.global.css`	同上，去掉作用域前缀	不能给根节点加类名时
`/<页面>.md`	任一页面的 Markdown 版本	只要某个组件
`/src/...`	同步来的源码原文，URL 路径就是仓库路径	要 React 源码时

每个 HTML 页面的 <head> 里都有 <link rel="alternate" type="text/markdown"> 指向自己的 .md。页面内容在构建时就写进了 HTML，不执行 JS 也能读全。robots.txt 对所有爬虫放行。

Markdown 头部字段

/components/button.md 的头部

---
title: 按钮 Btn
url: https://ui.zhaozimin.com/components/button
markdown: https://ui.zhaozimin.com/components/button.md
group: 组件
origin: 设计系统源码（src/system），本仓库是唯一源头
source:
  - src/system/components/v4/Button.jsx  # 源码原文地址
version: v0.2.0  # 设计系统版本
scope: .zzm-v4   # 根节点必须带这个类
css: https://ui.zhaozimin.com/v/0.2.0/zzm.css   # 锁版本地址
tokens: [--zzm-accent]
---

字段	含义
`origin`	设计系统源码（src/system）/ 提炼层组件（src/extracted）/ 展示版复刻 / 规范文档——都以本仓库为唯一源头
`source`	实现这一页的源文件，可直接 GET
`version`	设计系统版本号；引用样式时锁这个版本
`scope`	样式作用域，永远是 .zzm-v4
`tokens`	这一页直接依赖的 CSS 变量

铁律速查

✓ 要根节点 class="zzm-v4"，引入 zzm.css

✓ 要颜色只用 var(--zzm-*)；间距/高度/行高/圆角只取 4 的倍数

✓ 要按钮圆角矩形：sm/md 8、lg 12；高度 28/36/44

✗ 不要把可点的按钮做成 999 胶囊

✓ 要阴影只从 .zzm-btn .zzm-card .zzm-input 这些质感类取

✗ 不要自己写 box-shadow、backdrop-filter、渐变

✓ 要一屏只出现一次朱色 --zzm-accent，标「下一步」

✗ 不要用鲜艳纯红、奶油色暖底、网络字体、暗色主题

✓ 要禁用＝灰面灰字；等待＝ busy

✗ 不要用 opacity 淡化表示禁用

复刻完怎么自检

把你的实现和本站样张在同一台 Mac、同一缩放下截图，逐像素比对。常见偏差按出现频率排序：

没加 .zzm-v4：按钮变成浏览器默认样式。
字体不对：出现了 Inter 或网络字体。删掉，用系统字体栈 -apple-system, "PingFang SC", …。
尺寸差 1–2 像素：缺了 box-sizing: border-box。zzm.css 的基线段已包含；自己拆文件时别漏掉。
阴影方向不对：自己写了 box-shadow。删掉，交给质感类。
红太多：同屏出现了两处以上朱色。

入口

推荐阅读顺序

Markdown 头部字段

铁律速查

复刻完怎么自检