1实现原理 · 为什么它能做到
整个 skill 是纯 prompt 指令文件(单文件 SKILL.md,无脚本/资产),靠 persona + 绝对命令把『高价设计』编译成可执行规则:先立 persona『Vanguard_UI_Architect』并给定目标,再以『硬失败』式禁令框死反模式。
**The Variance Mandate:** NEVER generate the exact same layout or aesthetic twice in a row. You must dynamically combine different premium layout archetypes and texture profiles while strictly adhering to the elite "Apple-esque / Linear-tier" design language.
负向清单(ABSOLUTE ZERO)先封底:字体/图标/边框阴影/布局/动效五类『AI 默认值』一旦出现即判失败,把廉价观感的来源逐项点名禁掉。
If your generated code includes ANY of the following, the design instantly fails: - **Banned Fonts:** Inter, Roboto, Arial, Open Sans, Helvetica. (Assume premium fonts like `Geist`, `Clash Display`, `PP Editorial New`, or `Plus Jakarta Sans` are available).
正向生成由『组合式变异引擎』驱动:Vibe(氛围)× Layout(版式)各选其一、强调按上下文掷骰子,规避每次输出雷同;每种布局都自带移动端塌陷回退规则。
Before writing code, silently "roll the dice" and select ONE combination from the following archetypes based on the prompt's context to ensure the output is uniquely tailored but always premium:
组件级审美用具体 Tailwind 原子类写死:Double-Bezel(外框+内芯嵌套)、Button-in-Button 尾标、eyebrow 徽章,全部给出 class 级样板。
Never place a premium card, image, or container flatly on the background. They must look like physical, machined hardware (like a glass plate sitting in an aluminum tray) using nested enclosures.
动效全部按真实物理(mass/spring)规定:禁默认 transition,统一自定义 cubic-bezier,导航/按钮/入场均有编排脚本(stagger、morph、magnetic hover)。
Never use default transitions. All motion must simulate real-world mass and spring physics. Use custom cubic-beziers (e.g., `transition-all duration-700 ease-[cubic-bezier(0.32,0.72,0,1)]`).
性能护栏与实现纪律并列给出(transform/opacity-only、backdrop-blur 限 fixed/sticky、z-index 分层、噪声层 pointer-events-none),防止炫技拖垮移动端。
Never animate `top`, `left`, `width`, or `height`. Animate exclusively via `transform` and `opacity`. Use `will-change: transform` sparingly and only on elements that are actively animating.
交付有执行协议 + 11 项 pre-output 检查矩阵收口,输出统一为像素级 React/Tailwind/HTML 且禁止通用降级。
**[OUTPUT]** Deliver flawless, pixel-perfect React/Tailwind/HTML code. Do not include basic, generic fallbacks.
2核心能力
3外部依赖
| 类型 | 依赖 |
|---|---|
| package | Framer Motion |
| package | Phosphor Light / Remix Line 图标库 |
| package | Geist / Clash Display / PP Editorial New / Plus Jakarta Sans 字体 |
4风险提醒 风险提醒:绿色 · 放心使用
- 纯文本命令,遵从度完全依赖宿主模型 — 无任何可执行校验;若宿主模型忽略禁令(如仍用 Inter/Lucide),文件无强制手段,只能靠提示工程强度。
- 字体/库『假设可用』可能诱导外链或降级 — Geist/PP Editorial New 等若项目未安装,agent 可能擅自引入字体 CDN(不可控外链)或静默退回默认字体,破坏设计意图。
- 绝对化命令缺仲裁:用户点名要被禁元素时无优先级规则 — 『Banned Fonts: Inter…』等无『除非用户明确要求』豁免条款;与用户显式指令冲突时行为不可预测。
- 风格强、通用性窄:只输出一种『高价』气质 — 对极简编辑风、工业粗野风、存量系统改造等场景不适用,需搭配家族其它 skill 使用。
5第二遍独立确认
- [ok] 目录资产面(含隐藏/未跟踪文件) — git ls-files + ls -A 双查:该 skill 目录仅 1 个文件 SKILL.md,无 scripts/references/模板/数据/隐藏文件,无可执行代码。
- [ok] 执行类 token 扫描 — 逐文件扫描 bash/exec/child_process/curl/wget/fetch/axios/process.env/API_KEY/.env/fs./writeFile/.github 等零命中(brutalist 一处 'sans-serifs.' 单词结尾 fs. 为误报,人工复核排除)。
- [ok] 引文逐条 grep -F 字节复核 — 本 JSON 所用全部 quote 均以 grep -F 在 pin commit 工作树中逐条验证存在,无 paraphrase 冒充。
- [ok] 元数据与 pin 核对 — 本地 git HEAD == 任务 pin ccbc15639c97057cbfcf32ecebc38ef716e4bb37(README 显示该提交为 docs/sponsor 修订 #102,2026-08-24);GitHub API 实查 stars=85698、MIT、pushed_at=2026-08-24T15:23:56Z。frontmatter name 与任务给定名一致。
- [ok] 功能声明 vs 实际能力夸大检查 — description 声称均由 SKILL.md 正文纯 prompt 机制兑现,无脚本可调用、无越界承诺(详见本文件 how_it_works 引文)。
- [ok] description『make a website feel expensive』的实现机制 — 由 Section 2 禁令 + Section 4 双 bezel/按钮嵌套 + Section 5 物理动效具体兑现;98 行全文均为该目标服务,无与声明相悖内容。
- [ok] 『Framer Motion』仅作建议、非强制依赖 — 原文为『use IntersectionObserver or Framer Motion's whileInView』——二选一的或然表述,未强制引入库;output 层始终是标准 React/Tailwind/HTML。
- [ok] 移动端安全:变异布局是否可能破坏响应式 — 每种布局均配 Mobile Collapse 规则且 Section 8 清单第 8 项复查 <768px 单列塌陷,风险被显式对冲。
6结论
c04ed91fdd2f03c8…3cca18b368