PRD2HTML 是一个 agent 驱动技能,自动读取产品需求文档(PRD),分析其调性与内容结构,匹配最适合的视觉风格,生成包含动态 SVG 动画和交互解构模块的完整 HTML 页面。 🎨 10 大类行业风格 × 9 套品牌设计系统 🧩 7 种交互模板(流程图、时间线、对比、架构、数据流、状态切换、卡片筛选) 🔍 自动品牌检测:从 PRD 提取品牌信息,搜索真实品牌色/VI 🖼️ 图片提取:SVG 精准复现 + 用户原图嵌入 📱 响应式布局,单文件 HTML,浏览器直接打开
使用 Nano Banana Pro (Gemini 3 Pro Image) 生成或编辑图像。支持文生图、图生图及 1K/2K/4K 分辨率,适用于图像创建、修改及编辑请求,使用 --input-image 指定输入图像。
使用 Whisper CLI 进行本地语音转文字(无需 API 密钥)
使用 ffmpeg 从视频中提取帧或短片。
提供 UI/UX 设计智能与实现指导,帮助打造精美界面。适用于 UI 设计、UX 流程、信息架构、视觉风格、设计系统/标记、组件规格、文案/微文案、无障碍及前端 UI(HTML/CSS/JS、React、Next.js、Vue、Svelte、Tailwind)生成/评审/改进。工作流包括:①新 UI 布局与样式生成;②现有 UI/UX 改进;③设计系统标记和组件规范产出;④ UX 建议转化为代码变更。
专家级前端设计指南,用于创建美观、现代的用户界面。适用于落地页、仪表板等各类UI设计。
使用 mcp-diagram-generator MCP 服务器生成和编辑图表。适用于创建新图表、编辑现有的 .drawio/.mmd/.excalidraw 文件、网络拓扑图等场景。