关于这个模板
Build With Us 是面向AI 或 SaaS 产品的关于页参考，它背后的需求简报是一份完整的构建规格书，而不是情绪板。配色是白色 #FFFFFF 打底、深黄色 #434437 给文字、蓝色 #337EC8 承担强调色，字体用 Inter。交付形式是 React 和 Tailwind CSS，所以整个关于页可以直接搬进项目，不需要设计交接。从收录的需求简报起步，然后改这个关于页，而不是从零重建。需求简报钉住的一切（画幅、字号、时长、断点）下面都写出来了，所以你可以照着复刻这个关于页，不用猜它背后的意图。这一页剩下的部分按板块、再按时序和数值把这个关于页拆开，不加任何简报里没有的说法。
适合谁
- 先把 640x472 的画幅和 100vh 高的板块、48px 间距从这版关于页里拿走，再考虑别的。
- 自己写关于页文案的产品团队，需要每一行都守住展示级字号当初按长度定下的上限。
- 同时跑好几个项目的工作室负责人，会把这一版关于页当作其他页面照抄的样板。
包含哪些内容
- 导航是刻意做细的. 导航条是整套构图里最安静的部分：字标、一短行链接和一个 #337EC8 操作，全部压在需求简报最小的字阶上。导航条悬在 640x472 的构图上，自己没有底色，素材因此从它下面通到两边。把这一行控制在单行。
- 需求简报点了名. 尺寸是写明的，不是继承来的：100vh 高的板块、48px 间距。换字体或换文案，这些关系依然成立。因为数值是固定的，替换只改样子，不改节奏。搬运页面时保留这些写明的数值。
- 靠展示字号说话. 由 Inter 一个字体挑大梁：从标题到支撑句字号断得很干脆，字号越大字距收得越紧，层级因此由字体承担，而不是靠颜色。字距按字号分别设定，展示行和注释不共用同一个字距值。
- 字和画幅共用一套档位. 尺寸是写明的，不是继承来的：100vh 高的板块、48px 间距。换字体或换文案，这些关系依然成立。因为数值是固定的，替换只改样子，不改节奏。拿同一组数值验证重建结果。
动效与交互
反馈只出现在控件上
交互只发生在各自的控件上（悬停态只给按钮和链接，而不是每张卡片），页面其他地方不会跟着动。看起来能点的控件就真的能点，不会出现假的暗示。这份参考在 640x472 下收录。
不挡路的动效
这一份交付的是 640x472 下的静态构图，所以层级必须不靠动效也成立，它确实成立。需求简报里没有动画库，复刻的工作量因此很小。
对AI 与 SaaS来说成立的地方
代价是信息密度：这个关于页在首屏上说得比功能导向的版式更少。换来的是阅读顺序，导航、标题、公告徽标、数据行、卡片栅格做完了更长页面才会摊开做的事。它给SaaS读者的是一条通向主张的最短诚实路径。这份参考在 640x472 下收录。
把这个关于页变成你自己的
大多数人从强调色开始改。不如从主张开始：重写那行展示字，再在你的素材上重测蓝色 #337EC8。替换比重新构图便宜，这正是重点。
这个关于页怎么重排
窄屏版式是设计出来的，不是继承来的。每个宽度下板块高度锁在 100vh，层级因此扛得住重排。最后才会改的是顺序。
常见问题
Build With Us 背后的提示词到底有多长？
简报是从页面上收录下来的，共 6,252 个字符，覆盖画幅、字阶、色板和过渡。复制拿到的就是这段文本，发给 Studio 则会用同一份描述把请求预先填好。
Build With Us 的简报和我自己写的提示词是一回事吗？
页面上引用的内容全部出自收录的 6,252 字符简报，而不是事后补写的说明。数字和文字能对得上，原因就在这里。
Build With Us 有多少地方依赖 React 和 Tailwind CSS？
Build With Us 是用 React 和 Tailwind CSS 构建的，条目标注只是说明出处。简报写的是位置、尺寸和时长，所以任何能设字体、能摆元素的前端框架都能重建。
