SkillFeeder › 全部 Skill › 设计与视觉 › web-design
根据需求一键生成 DESIGN.
web-design
web-design 是 SkillFeeder 收录的Agent Skill，来自 GitHub 仓库 xiaopu-ai/web-design。根据需求一键生成 DESIGN.md 规范，再输出完整可用的网页代码。适合产品/设计师/前端开发者。场景是设计与视觉 · Figma/UI。能做的事包括产出可复用、可编辑的 DESIGN.md 设计规范、支持截图/URL/关键词/PRD 多模态输入、生成含 UI/UX、动效、响应式的达标网页。打开 GitHub 自行安装。
能做什么
- 产出可复用、可编辑的 DESIGN.md 设计规范
- 支持截图/URL/关键词/PRD 多模态输入
- 生成含 UI/UX、动效、响应式的达标网页
原文简介
Web 视觉设计 SKILL。输入 PRD / 参考 URL / 截图 / 关键词（任意组合），先产出一份标准化 DESIGN.md 设计规范，用户确认后据此生成 UI/UX、视觉、动效、响应式全部达标的 web 代码。专攻 web 端：Landing Page、Portfolio、产品页、博客、个人站、SaaS 介绍页等。当用户说"帮我做个网站""设计一个页面""参考 XX 做一个""把这个截图/PRD 做成网页""做一个 landing page""出一份 design 规范"时触发。不用于后端、数据库、纯逻辑 bug 修复。
同场景推荐
- frontend-design所在仓库 anthropics/skills，仓库 ★ 190,432打造不落俗套的专属UI视觉方案，拒绝模板化默认样式。
- web-artifacts-builder所在仓库 anthropics/skills，仓库 ★ 190,432用 React + Tailwind + shadcn/ui 构建带状态和路由的 claude.ai 单文件 HTML 交互式前端产物
- frontend-ui-engineering所在仓库 addyosmani/agent-skills，仓库 ★ 114,402构建符合设计系统、无障碍、响应式的生产级前端界面
- apple-hig所在仓库 nexu-io/open-design，仓库 ★ 106,772生成符合苹果人机界面规范的跨平台设计文档与组件说明
- artifacts-builder所在仓库 nexu-io/open-design，仓库 ★ 106,772生成带交互组件的 Claude HTML 产物，含 React、Tailwind 和 shadcn/ui
- industrial-brutalist-ui所在仓库 nexu-io/open-design，仓库 ★ 106,772构建数据密集型仪表盘，呈现解密蓝图般的机械终端界面
- frontend-design所在仓库 bytedance/deer-flow，仓库 ★ 85,186生成高审美、可直接运行的前端界面，输出 index.html
- web-design-guidelines所在仓库 bytedance/deer-flow，仓库 ★ 85,186自动检查网页代码是否符合最新 Web 界面设计规范