别再瞎画了！github上2万星的三条命令把空白页面变成能上线的设计稿：这个在线工具网站Impeccable（点击标题）通过teach、shape、craft三条指令构建设计与开发流程，从空白界面到完整UI产出，从零创造到迭代优化，一套流程打通所有环节。
Impeccable将设计从混乱变成流程，流程靠三条命令串起来。你从一个空白页面开始，脑子里一堆模糊想法，然后通过三步走，最后变成一个完整能上线的界面。
这三步就是先写清楚你要干嘛，再画个大概轮廓，最后打磨成能用的设计。对应的命令就是斜杠 impeccable teach、斜杠 impeccable shape 和斜杠 impeccable craft。它们连起来就是一条弧线，从抽象到具体，从想法到成品。
但是光会搞新东西还不够，你手里可能已经有个半成品网站想改一改。这时候就得用另外一套玩法，靠PRODUCT.md和DESIGN.md这两个文件来干活！
为什么选择 Impeccable？
这是你一直需要但自己不知道的词汇，包括：1项技能、23条命令、精选反模式，帮你实现完美前端设计。
Anthropic 创建了 frontend-design 这一技能，用来引导 Claude 做出更好的用户界面设计。Impeccable 在此基础上进一步深化，提供更专业的知识和更强的控制力。
所有大语言模型都学自那些千篇一律的通用模板。如果没有额外引导，你只会得到同样可预见的错误：Inter 字体、紫色渐变、卡片套卡片、彩色背景上放灰色文字。
Impeccable 通过以下方式对抗这种偏见：
- - 一个扩展版技能，包含7个领域专属的参考文件（查看源码）
- - 23条命令，用于审查、评审、打磨、提炼、添加动效等
- - 精选的反模式，明确告诉人工智能“不要做什么”
包含内容
技能：impeccable
一项综合性的设计技能，包含7个领域专属的参考文件（查看技能）：
参考文件 涵盖内容 |
告别紫色渐变和Inter字体！这套前端设计技能让你超越所有大模型
总之：Impeccable 是一套基于 Anthropic frontend-design 扩展的前端设计技能，包含7个领域参考文件和23条命令，通过明确告诉人工智能“不要做什么”的精选反模式，帮助开发者避免大模型常见的通用模板错误，实现真正专业的前端界面设计。
快速开始：访问 impeccable.style 下载即用包。
为什么大多数人一开始就走歪
很多人做界面设计的习惯是打开工具直接开画，结果画着画着就开始崩。颜色一会儿高级灰一会儿荧光绿，按钮风格忽粗忽细，页面结构像拼乐高想到哪拼到哪。
原因很简单，你跳过了想清楚这一步。设计这事儿如果一上来就动手，很容易变成边做边想，最后就成了边崩边改。写代码也一样，啥都不想直接敲键盘，出来的东西自己都看不懂。
Impeccable干的第一件事就是把你按住，让你先说清楚再说别的。这就像你出门旅游先看地图，而不是随便买个票就冲出去。
第一段弧线起点是把脑子里的东西说人话
这一段就是斜杠 /impeccable teach。
写简报这一步决定你后面会不会翻车。这个命令干的事很朴素，帮你生成一份叫PRODUCT.md的文件。说白了就是把你脑子里的想法翻译成结构化说明。
里面通常会包括这个界面是给谁用的，用户来这儿是想干嘛，最重要的功能是什么，大概是什么场景。你可以把它理解成设计前的需求说明书。有个叫HanifCarroll的网友问过，如果没有这个文件能不能让AI自己生成，Paul说当然能，敲斜杠 impeccable teach就行了。
很多人觉得这一步多余，其实恰恰相反。你不写这个，后面每一步都会摇摆。写了这个，相当于给整个设计打了地基。这个文件就像一个翻译官，把你的模糊想法变成AI能看懂的文字。
第二段弧线开始出现形状
这一段是斜杠/impeccable shape。
草图阶段决定结构稳定性。这个命令的作用是根据PRODUCT.md给你生成一个草稿设计。注意这不是最终UI，它更像线框图加结构草稿。
它会帮你解决几个关键问题，页面分几块，信息怎么摆，用户视线怎么走。说人话就是先把房子的格局搭好，再考虑装修。这个阶段最容易被忽略，但也最容易翻车。因为一旦结构错了，你后面再怎么美化都救不回来。
另一个相关的命令是斜杠 impeccable document，这个命令是用来生成DESIGN.md文件的。DESIGN.md和PRODUCT.md不一样，它不管产品是干啥的，只管这个产品长啥样。比如用啥颜色，按钮是圆角的还是方角的，字体用多大，间距留多宽。这两个文件一个管功能一个管样子，配合起来用效果最好。
第三段弧线才是你以为的设计
这一段是斜杠/impeccable craft。
精修阶段才开始谈美感。这一步才是大家最熟悉的设计感，它会在已有结构基础上做配色方案、字体选择、间距节奏和视觉层级。这时候AI已经不是在猜，而是在优化，因为前面两步已经把方向锁死了。
有个叫Rick Blalock的网友激动坏了，他说这玩意儿太好用了，他刚把自己的个人网站整个重做了一遍。这就是craft命令的实战效果。你可以理解为前两步在决定对不对，这一步在决定好不好看。
创造模式和迭代模式是两条不同的路
咱们现在得说清楚一个特别重要的事。你啥都没有的时候，比如想搞个新网站，脑子里有个大概样子但是一行代码都没写，这时候就得用创造模式。Paul专门给这个模式设计了craft指令，你只要敲斜杠 impeccable craft，告诉它你想做个啥，它就能帮你从零开始搞出一整套东西来。
反过来讲，你要是已经有个网站或者有个代码在那摆着，想加点新功能或者改改样子，那就得用迭代模式。这个模式不会把你原来的东西全推翻了重来，而是在基础上做修改。Paul在推特上说，这个模式主要靠DESIGN.md这个文件来干活。
有个叫Somi AI的网友问了一个特别到位的问题，他说这工具咋知道是新项目还是老项目呢，是用户自己告诉它还是它能自己闻出来。Paul的回答特别有意思，他说两个方法都有。首先你可以用craft指令明确告诉它你要搞新的。但是就算你不说，它也会自己去找PRODUCT.md和DESIGN.md这两个文件，看看里面有没有东西。
你看这个设计就很聪明。也就是说Impeccable启动的时候会先翻翻你的文件夹，如果发现了这些设计文档，它就懂了，哦这原来是个老项目，那我得小心点别把人家的东西搞坏了。如果没有这些文档，它就默认这是个新项目，可以放开了搞。
GPT五点五和Codex谁更快谁更好
现在咱们来说说速度这个问题。Paul自己发的那条推特开头就说，最快的方式可能是Codex搭配Composer 2，或者Codex搭配Codex Spark。但是紧接着他就加了一句特别重要的话，快不一定是最好的。这句话是重点，你得刻在脑子里。
那啥是最好的呢。Paul说他会选GPT 5.5，而且要把推理强度调低。这里解释一下啥叫推理强度，大白话就是说这个AI想问题想得多深。调低了就是说你别想太多别绕弯子，简单直接一点反而更好。他之所以觉得GPT 5.5更好，可能是因为这个模型更稳当，出来的代码更规整，不容易出bug。
但是这里要注意一个事情，Paul说这个话的时候是有上下文的。他是在回答一个关于最快的问题，所以他的意思是如果你只追求速度那就Codex，但是如果你想要质量好那就GPT 5.5。这就好比开车，你想最快到地方那就开两百码，但是最容易翻车。你想安全到达那就开一百码，虽然慢一点但是靠谱。
三条命令为什么要连成一条弧线
很多人会问，我能不能直接用斜杠 impeccable craft一步到位。可以，但大概率翻车。原因很简单，你跳过了前面的信息收敛过程。
这三步连起来的逻辑是模糊变清晰，清晰变具体，具体变精细。它不是三段独立操作，而是一条连续曲线。每一步都在减少不确定性。如果你直接跳到最后一步，AI只能靠猜，猜对了是运气，猜错了你就要重来。
有个叫web3nomad的网友分析得特别专业。他说把工作分成两种模式这个设计真是太对了。因为从零开始创造需要的是想象力，需要扩散式地去找各种可能性。但是在老项目上迭代需要的是守规矩，要按照已有的设计系统来改。这两种任务需要的工具完全不一样，大多数AI工具想用一个模型干两件事，结果两件事都干不好。
这套流程真正解决的不是设计能力问题
很多人误以为这是在帮不会设计的人做设计。其实更深一层是它在帮所有人稳定输出。设计最大的问题不是不会，而是不稳定。今天状态好设计很牛，明天状态差直接拉胯。
这套流程干的事是把设计从靠感觉变成靠流程。你只要按这三步走，结果不会离谱。这才是它真正的价值。文件就像地基，你在地基上盖房子，怎么盖都不会歪。没有地基的话，你今天盖个墙明天可能就得推倒重来。
Paul在回复网友的时候也提到了，他还有很多想法能让这个文件系统变得更丰富。也就是说现在这个版本还只是个开始，以后可能会更厉害。比如说文件里可能不光写样式，还能写动效写交互逻辑，让AI理解得更透彻。
提交代码给项目有个重要前提
咱们来聊聊开源贡献这个事情。有个叫Quoc Huy的网友问能不能给Impeccable这个项目提交代码，虽然这工具用起来很顺手但是偶尔也有点小bug。Paul的回答挺有意思的，他说可以提，但是有个条件，必须是经过充分测试的干净的代码。
为啥要这么严格呢。Paul自己说了，因为他收到了太多AI生成的一次性垃圾代码。这个情况现在特别普遍，很多人让AI糊弄一段代码就直接提过来了，自己都没跑过也没看过。这种代码看着像那么回事，实际上跑起来全是坑。所以Paul现在特别小心，不是随随便便谁的代码都收。
他还说了一个特别实在的建议。如果你发现了一个问题，最好的办法不是自己瞎改一通然后提代码，而是先把这个问题的现象描述清楚，作为一个issue提出来。这样他就能根据你的描述自己动手去改，反而更快。这个建议对所有开源项目都管用，别一上来就提代码，先把问题说清楚更重要。
为什么评论区一堆人开始重做页面
你会发现一个现象，很多人用了之后第一反应是我要重做我的网站。这不是冲动消费，这是认知被刷新。因为他们第一次发现原来设计可以这么走，不是靠灵感，是靠流程。
当你意识到这一点，你再看自己以前的设计就会觉得像没打草稿直接写作文，写完自己都不想看。有个网友叫Jim Faster就直接喊了出来，说这下完了我非得把我的登陆页面重做一遍不可，我这辈子都发布不了了。Paul回了句抱歉啊不抱歉，那语气明显是在偷着乐。
最后给你一句很实在的提醒
这套东西确实好用，但有个前提，你得老老实实走完整个流程。别想着偷懒，别一来就craft，别嫌teach麻烦，别跳过shape。
你要是还按以前那套想到哪做到哪，再好的工具也救不了你。但你一旦把这三步走顺了，会有一个很明显的变化，你做设计不再靠运气，而是每一步都有依据。不管是搞新项目还是改老项目，不管是用Codex冲速度还是用GPT 5.5保质量，只要流程对了，结果就差不到哪去。
这才是从会做图的人变成能做产品的人的分水岭。