AgentHubAgentHub

使用场景/设计与创意

设计类 MCP / Skill 推荐

Figma、图像生成、品牌素材。适合产品、运营、设计协作。

共匹配 1,864 个资源 · 第 28 / 39 页

什么是设计与创意?

设计类 MCP 把设计工具与图像生成能力接入 AI 工作流:Figma MCP 让 AI 读取设计稿的图层、变量与组件结构,直接生成对齐设计稿的前端代码;图像生成类 MCP 负责配图、图标与营销素材的批量产出。

典型用法:设计师在 Figma 中标注组件 → 开发者在 Cursor 中通过 Figma MCP 拉取节点信息 → AI 生成与设计系统一致的 React / Vue 代码。评审环节可以让 AI 对照设计稿截图做还原度检查。

注意版权与授权:仅处理团队有权访问的 Figma 文件;生成图片素材时确认模型的商用条款;字体与第三方素材仍需单独授权。

适合做什么

  • 设计稿评审
  • 素材批量导出
  • 品牌规范检查
  • 配图生成

不太适合

  • 未授权商用字体/素材的自动下载

相关资源

查看全部 →

Flutter

v1.0.3

SkillClawHub4.4k

构建、调试并发布 Flutter 应用:widget、布局约束、状态管理、导航、性能与应用商店发布。适用于编写 Dart widget 或界面;RenderFlex 溢出、viewport 高度无界或 RenderBox 未完成布局;在 build 期间或 dispose 之后调用 setState、跨 async 间隙使用 BuildContext;UI 卡顿、滚动不流畅或图片耗尽内存;热重载失效;Provider、Riverpod 或 Bloc 过度或不足重建;使用 Navigator 或 go_router 路由、深度链接或返回键处理;键盘遮挡表单字段或校验异常;平台通道抛出 MissingPluginException;本地化字符串或 RTL 布局镜像;widget、golden 或集成测试在 CI 中挂起或失败;debug 构建正常但 release APK、IPA 或 web 包出错。不适用于 React Native 或纯 Swift/Kotlin 原生开发。

source

media-use

v1.0.73

SkillClawHub4.5k

Agent Media OS——HyperFrames 项目中覆盖所有媒体需求的单一技能。将 BGM、SFX、图片、图标、品牌 logo、配音、调色或 LUT 解析为冻结的本地文件或可粘贴区块,并留存台账记录(统一动词 resolve);目录未命中时可经 TTS/音乐/图像模型即时生成;通过同一共享音频引擎完成配音、转写、字幕与背景音移除;对媒体执行操作(剪切/重构图/变换);并支持跨项目复用素材。当模糊反馈涉及实拍画面偏暗、平淡、无聊、想要复古/摄影机/印刷/ASCII 质感、需要隐私处理或需要媒体揭示时刻时,同样使用本技能。

source

Google Cloud

v1.0.2

SkillClawHub4.1k

为 Google Cloud 做架构设计、调试、安全加固与成本优化——覆盖 Cloud Run、GKE、Compute Engine、BigQuery、Cloud SQL、IAM、VPC。适用于在 GCP 上部署或评审资源、账单激增或需降低 BigQuery 扫描成本、排查无显而易见的 403 PERMISSION_DENIED、SERVICE_DISABLED、RESOURCE_EXHAUSTED 配额错误、502/503/504 或 Cloud SQL 无法访问的原因,在计算(Cloud Run、GKE、Cloud Functions)或数据库(Cloud SQL、AlloyDB、Spanner、Firestore、Bigtable)之间选型,加固服务账号、组织策略、防火墙规则、公开存储桶或密钥,为 google provider 编写 Terraform,或审计继承的项目。涵盖 VPC/子网设计、Private Google Access、Vertex AI/GPU 配额、Pub/Sub/Dataflow、备份/容灾和 gcloud。不适用于编写 Kubernetes 清单(见 k8s)、Terraform 语言机制(见 terraform)或 Cloud SQL 内的 PostgreSQL 调优(见 pg)。

source

Next.js 前端开发与集成

v0.1.1

SkillClawHub4k

生成可用于生产环境的 Next.js 项目,包含 TypeScript、Tailwind CSS、shadcn/ui 与 API 集成。当用户要求构建、创建、开发或搭建 Next.js 应用、Web 应用、全栈项目,或带后端集成的前端时使用。优先采用现代技术栈(Next.js 14+、TypeScript、shadcn/ui、axios、react-query)与最佳实践。也会在新增功能、集成 API 或扩展现有 Next.js 项目时触发。

source

VSCode 配置调试

v1.0.2

SkillClawHub3.7k

配置、调试并加速 Visual Studio Code:设置作用域、launch.json、tasks.json、扩展、快捷键、格式化器与远程开发。当某项设置被其他配置覆盖而不生效、保存时格式化了错误的格式化器或两个格式化器互相打架、断点一直是空心、F5 毫无反应或调试配置无法附加、watch 任务永远卡在 preLaunchTask、扩展宿主崩溃或两个扩展冲突、IntelliSense 失效且 TypeScript 服务器或 Python 解释器停止解析、快捷键被终端吞掉、Remote-SSH/WSL/dev containers/隧道行为异常、启动/搜索/文件监视缓慢,或需要决定 .vscode/ 里放什么、VSCodium 或 Cursor 这类衍生版能装哪些扩展时使用。不适用于语言语义(typescript、py)、Docker 镜像编写(docker)或通用缺陷定位(debugging)。

source

stellar-trails

v9.18.0

SkillClawHub3.8k

每个任务都会激活:编码(功能、缺陷、重构、脚本)、文档(报告、方案、DOCX、PDF)、图表与可视化、数据处理、复杂多步规划,乃至简单提问。提供六阶段工作流,含追溯 ID、进出口关卡、范围承诺与三层强制执行机制(阶段机、强制打印、偏好对话框)。复杂度按任务层级自适应。当用户要求构建、修复、分析、创建、规划或处理任何内容时使用——琐碎任务在框架内走精简流程,复杂任务完整执行。Web 开发(Next.js、UI)交由 fullstack-dev 处理;本框架在其外层包裹工作流。

source

x402 Compute

v1.31.0

SkillClawHub3.8k

当用户提出「开通 GPU 实例」「通过 API 集成智能体 pod」「为客户创建 pod」「pod webhooks」「pod 事件」「启动云服务器」「列出算力套餐」「浏览 GPU 价格」「部署 AI 机器」「一键部署运行 LLM 的 GPU」「部署私有 LLM 端点」「OpenRouter 就绪端点」「智能体部署 GPU」「拉起自己的 OpenAI 兼容端点」「扩容算力实例」「变配算力实例」「销毁服务器实例」「查看实例状态」「列出我的实例」「充值算力额度」「查看额度余额」「在网格上跑推理」「去中心化推理」「OpenAI 兼容 API」「机密/TEE 推理」「列出网格模型」「查看网格容量」「运行节点」「提供算力」「成为网格节点」「节点运营者」「加入网格」「质押运行节点」「在网格上服务模型」「靠算力赚钱」「部署常驻 AI 智能体」「部署托管 OpenClaw 智能体」「拉起 ClawPod」「智能体 pod」「托管……」等请求时使用本技能。

source

CSS

v1.0.4

SkillClawHub3.5k

编写和调试 CSS:flexbox 与 grid 布局、z-index 与层叠上下文、响应式断点、主题化与渲染性能。适用场景:布局错乱或溢出、z-index 无效、页面横向滚动、`position: sticky` 吸不住、文字无法截断、样式层叠失效或被迫加 `!important`、加载时内容跳动(CLS)、过渡卡顿、字体闪烁、模态框或下拉菜单被其他内容盖住、表单控件需要重样式、表格需要吸顶表头、打印效果出错、或样式在 Chrome 正常而 Safari 失效。也可用于从零建样式表(reset 与基础层)、居中、容器查询、clamp() 流式字号、设计令牌与暗色模式、RTL 与逻辑属性,以及用 `:has()`、`@layer` 和嵌套现代化旧样式表。不适用于视觉设计品味——配色、间距尺度、字体选择。

source

常见问题

Figma MCP 需要什么权限?

需要 Figma 个人访问令牌(Personal Access Token)或企业 OAuth 授权,令牌只需授予文件读取范围。AgentHub 详情页标注了对应环境变量。

AI 能直接把设计稿转成代码吗?

可以读到结构并生成初版代码,但复杂交互与响应式仍需人工调整。业界普遍把它用作「设计到代码」的第一稿加速器而非最终交付。

生成图片的 MCP 会侵权吗?

取决于模型训练与输出条款。商用发布前请确认服务提供方公开的版权政策,重要素材保留人工审核环节。

配套安装与配置教程

相关场景