Web Design

使用 Nano Banana Pro (Gemini 3 Pro Image) 生成或编辑图像。支持文生图、图生图及 1K/2K/4K 分辨率，适用于图像创建、修改及编辑请求，使用 --input-image 指定输入图像。

使用 Whisper CLI 进行本地语音转文字（无需 API 密钥）

使用 mcp-diagram-generator MCP 服务器生成和编辑图表。适用于新建图表、编辑现有 .drawio/.mmd/.excalidraw 文件、网络拓扑、架构图、流程图、泳道图、时序图、类图、ER 图及 Excalidraw 白板工作。当用户要求绘图时，始终使用此技能。

使用 ffmpeg 从视频中提取帧或短片。

提供 UI/UX 设计智能与实现指导，帮助打造精美界面。适用于 UI 设计、UX 流程、信息架构、视觉风格、设计系统/标记、组件规格、文案/微文案、无障碍及前端 UI（HTML/CSS/JS、React、Next.js、Vue、Svelte、Tailwind）生成/评审/改进。工作流包括：①新 UI 布局与样式生成；②现有 UI/UX 改进；③设计系统标记和组件规范产出；④ UX 建议转化为代码变更。

强大的AI自动化绘图与复杂信息可视化工具（基于 ContextWeave）。不仅支持代码与系统架构的可视化，更广泛适用于复杂逻辑梳理、知识库转换、业务流程图、思维导图及长文本的结构化信息图生成。通过深度的语义分析与请求编排，一键将晦涩文本与复杂知识转化为清晰直观的图形表达。

专家级前端设计指南，用于创建美观、现代的用户界面。适用于落地页、仪表板等各类UI设计。

使用 Remotion + React 进行程序化视频创作的完整工具包。涵盖动画、时间控制、渲染（CLI/Node.js/Lambda/Cloud Run）、字幕、3D、图表、文字特效、转场及媒体处理。适用于编写 Remotion 代码、构建视频生成流水线或创建数据驱动的视频模板。

涵盖安全、性能、可维护性、正确性和测试的系统化代码审查模式，包含严重等级、结构化反馈指南、审查流程及需避免的反模式。适用于审查 PR、建立审查标准或提升审查质量。

{"answer":"使用 Playwright 和 Cypress 构建稳定高效的 E2E 测试套件：覆盖核心链路，消除不稳定测试，集成 CI/CD。"}

务实的编码规范，编写简洁、可维护的代码——命名、函数、结构、反模式及编辑前安全检查。适用于编写新代码、重构现有代码、审查代码质量或制定编码规范。

使用Mermaid语法创建软件图表。当用户需要通过类图、时序图、流程图、ER图、C4架构图、状态图、Git图等创建、可视化或记录软件时使用。触发词包括绘制图表、可视化、建模、梳理结构或展示系统流程。

Build scalable, themable Tailwind CSS component libraries using CVA for variants, compound components, design tokens, dark mode, and responsive grids.