先选任务
以“围绕预期行动组织的网页”为目标选择。比较下方示例，准备自己的材料，阅读运行要求后再安装。
登陆页面或完整网站 · 您当前网站的部分 · 作品集或简历
Website Template Skills for AI agents
以“围绕预期行动组织的网页”为目标选择。比较下方示例，准备自己的材料，阅读运行要求后再安装。
Works in
选择一种网页设计技能开始
开始制作前的三个判断
这里的每项Claude设计技能都是一个包含说明、布局参考和检查的文件夹。当您请求页面时，您的智能体会加载它，因此设计决策已经做出。
核对输入
整理已确认文案、源文件与输出限制；让智能体排版前先标出缺失材料。
定义验收
在窄屏与键盘导航下检查完整路径。
查找适合您角色的网页设计技能
Each role page picks the Skills that fit that job best.
从一份小样开始
Three steps in Claude Code, Codex or Cursor. No design app needed.
- 1
检查技能包
获得访问权限后下载，阅读 SKILL.md，确认依赖与额外费用。
Download the ZIP from this Skill page, extract it, and follow SKILL.md. - 2
先安排一个小任务
让智能体先围绕“围绕预期行动组织的网页”制作草稿。提供来源材料，不依赖示例事实。
/bs-scattered-cards-magazine Build a responsive landing page from this brief, copy, and brand kit. - 3
检查后再扩展
在窄屏与键盘导航下检查完整路径。
index.html
一份有效需求的三个部分
| 部分 | 需要说明什么 |
|---|---|
| 结果 | 围绕预期行动组织的网页 |
| 依据 | 已经确认的来源材料，以及明确标出的缺失事实。 |
| 验收 | 在窄屏与键盘导航下检查完整路径。 |
Every Skill, one plan
Install any Skill on this page and every new one we add. Cancel anytime.
Cancel anytime
Monthly
US$8.99 / month
Full Premium access, billed monthly.
- Access all Premium Skills
- Install from the web or CLI
- Secure browser-authorized CLI access
- Ongoing Skill updates
- New Premium Skills included
- Cancel whenever you need
Annual membership
Most popularYearly
US$69.00 / year
Full Premium access for a lower annual price.
- Access all Premium Skills
- Install from the web or CLI
- Secure browser-authorized CLI access
- Ongoing Skill updates
- New Premium Skills included
- Cancel whenever you need
Pay once · Founding price
Founding offerFounding Lifetime
US$159.00 one-time
Founding price — increases as the library grows.
- Access all Premium Skills
- Install from the web or CLI
- Secure browser-authorized CLI access
- Ongoing Skill updates
- New Premium Skills included
- No subscription or renewal bill
Cancel anytime. Payments are non-refundable.
网页设计技巧常见问题解答
什么是网页设计技能？
一个包含 SKILL.md、布局参考和检查的文件夹，可教您的 AI 智能体进行一种经过验证的网站设计。当您请求页面时，智能体会加载它。
Claude Code 可以用技能建立一个网站吗？
是的。将 Skill 安装到 Claude Code 中，描述站点，然后它会按照 Skill 的布局编写 HTML。 Codex 和 Cursor 的工作方式相同。
我可以获得 HTML、React 或 Figma 文件吗？
大多数网页设计技能都会提供有效的 HTML 文件。有些还在其详细信息页面上命名 Next.js 或组件输出；没有人提供 Figma 文件。
网站模板是免费的吗？
有些是。免费技能带有免费标签；其余的都包含在 Pro 中，或者可以一次购买一个。