AgentHubAgentHub

使用场景/设计与创意

设计类 MCP / Skill 推荐

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

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

什么是设计与创意?

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

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

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

适合做什么

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

不太适合

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

相关资源

查看全部 →

Solana 开发技能

v1.0.0

SkillClawHub2.5k

端到端的 Solana 开发手册(2026 年 1 月)。React/Next.js 界面优先使用 Solana 基金会的 framework-kit(@solana/client + @solana/react-hooks);所有新的 client/RPC/交易代码优先使用 @solana/kit。当旧依赖需要 web3.js 时,把它隔离在 @solana/web3-compat 之后(或将 @solana/web3.js 作为真正的旧版兜底)。内容覆盖以 wallet-standard 为先的连接方式(含 ConnectorKit)、Anchor/Pinocchio 程序、基于 Codama 的客户端生成、LiteSVM/Mollusk/Surfpool 测试以及安全检查清单。

source
辨别力追问 icon

辨别力追问

SkillGitHub

当给出的实质性回答或草稿可能被用户据此行动(建议或推荐、目标/计划/提案/邮件等草稿、估算或预测、数据分析解读、可能被采信的事实陈述、多步论证)时,在定稿前调用本 skill,视情况附上 2-3 个简短的追问,每个问题都紧扣刚产出的内容,帮助用户核对关键事实、审视推理与假设、发现缺失的上下文。每次对话至多使用一次。简单操作问答、纯知识讲解、仅排版转换拼装文件、编写要运行的代码、创意写作或闲聊、或用户已要求复核/引用/审查时应跳过。

sourceregistry 收录

hyperframes-animation(HyperFrames 动画)

SkillSkillsMP

HyperFrames 全部动画知识——原子运动规则、多阶段场景蓝图、场景转场、更宽泛的 motion design 技巧,以及七种运行时适配器(默认 GSAP,另有 Lottie、Three.js、Anime.js、CSS keyframes、Web Animations API、TypeGPU)。适用于任何运动或动画任务:挑选 2-4 条规则进行组合,或加载蓝图,或查询运行时专属 API(如 GSAP eases、Lottie 播放器、Three.js mixer)。还可审计现有合成的动作编排(animation map)与 24 种命名文字动画效果。HyperFrames 原生特性:单一暂停时间轴、seek-safe、确定性。

source

v8-understanding

SkillSkillsMP

Guides the methodology for investigating V8 concepts, codebase structure, performance, memory, and architecture. MANDATORY to use whenever triaging bugs, investigating crashes, reading C++ files, analyzing compiler optimizations (Ignition, Maglev, TurboFan, Turboshaft), or doing static research on V8 subsystems. Essential for locating high-level design documents in the local docs/ directory before reading C++ code. Do not use for raw build commands or Git workflows.

source

motion-graphics(动态图形)

SkillSkillsMP

以运动本身传递信息的短设计型 motion graphic——动态字体、数字滚动、图表/数据可视化呈现、logo 片头/品牌定格、下三分之一字幕条/浮层/社媒 overlay、动画地图(区域高亮、地点连线、缩放到某地)、推文/新闻文章/标题动画、网页/UI 动画(滚动、光标、callout),或将真实图片的几何结构融入图表。通常 10 秒以内(最长约 30 秒),无旁白与真人实拍;渲染为 MP4 或透明 overlay。更长的/有旁白的/多场景的用 /general-video;不明确的用 /hyperframes。

source

hyperframes-keyframes(HyperFrames 关键帧)

SkillSkillsMP

当 HyperFrames 合成需要推近、拉出、缩放、改构图、Ken Burns 效果、运镜、视觉匹配/甩镜交接,或其他 seek-safe 的 2D/3D 关键帧时使用;也用于 GSAP、CSS keyframes、Anime.js、WAAPI、FLIP、路径、遮罩、SVG morph/draw、文字拖尾、3D 纵深,或 `hyperframes keyframes` 诊断。不要用于宽泛的场景策略、品牌设计、素材获取、字幕或一般视频规划。

source

SRS 内部代码地图

SkillSkillsMP

把 SRS 与 Oryx 的代码任务路由到最小相关的可信代码库地图与验证指引。只要支持、开发、调试、评审或维护工作需要定位、选择、阅读、修改、测试或验证 SRS/Oryx 代码时使用。覆盖第一代 C++ 源站与边缘媒体服务器及其 State Threads 依赖、下一代 Go 服务器、浏览器推流与播放、SRS Docker 镜像工具链、SRS 测试,以及 Oryx 的 Go 后端、React 控制台、一体化运行时、打包、安装器、发布与测试。作为父级支持与发展技能的代码导航依赖;面向用户的工作流程与结果仍由父技能负责。

source

SRS/Oryx 开发

SkillSkillsMP

SRS 与 Oryx 代码库以及 SRS Docker 镜像工具链的开发、修改、调试、评审、维护与讲解。用于对下一代 SRS Go 代理、SRS 浏览器播放器、ossrs/dev-docker 镜像,以及 Oryx 的 Go 后端、React 控制台、一体化运行时、打包、安装器、发布与测试做计划性改动;也包括缺陷维护、issue 与 PR 分诊、PR 评审以及 Learn Code 提问。C++ 版 SRS 服务器已进入维护模式,基于 Go 的新版源站与边缘节点的规划性开发尚不支持。不适用于终端用户支持、使用提问或配置咨询——这些请使用 srs-support。

source

maintaining-docker-hub

SkillSkillsMP

Use when working on Trilium's published Docker images on Docker Hub or GHCR rather than on the Dockerfiles — "how many pulls does the image get?", "why is the Docker Hub repository so big?", "clean up old tags", "delete untagged images", "which tags do we publish?", the legacy repositories (triliumnext/notes, zadam/trilium) and their mirroring, the main-docker.yml copy-to-Docker-Hub step, mirror-legacy-docker.yml, Docker Hub categories, stars or the overview. Includes hub.mjs (stats, tag listing/deletion, the manifest inventory and a safe untagged-image purge, all dry-run by default) and the storage model that decides how a cleanup works. Do NOT use for building or running the image locally (see the Developer Guide's Docker page).

source

Browser Use Cloud 文档

SkillSkillsMP

Browser Use Cloud(托管版浏览器自动化 API)文档参考。凡涉及 Cloud REST API(v2、v3 或 v4)、browser-use-sdk(Python 或 TypeScript)、X-Browser-Use-API-Key 鉴权、cloud sessions、浏览器 profile、profile 同步、CDP WebSocket 连接、隐身浏览器、住宅代理、验证码处理、webhook、workspace、skill 市场、liveUrl 流、定价,以及集成模式(聊天界面、subagent、把浏览器工具接入已有 agent)时使用。n8n/Make/Zapier 集成、云上 Playwright/Puppeteer/Selenium、1Password 密钥库相关问题也适用。不适用于开源 Python 库(Agent、Browser、Tools 配置)——那些请用 open-source skill。

source

optimize-for-gpu(GPU 加速优化)

SkillSkillsMP

将科学 Python 工作负载加速到 NVIDIA GPU 上,并验证结果正确且更快。适用于 CUDA/GPU 优化;CPU 受限的 NumPy、SciPy、pandas、scikit-learn、NetworkX、scikit-image、向量检索、图像处理、图、仿真或文件 I/O 负载;CuPy、cuDF、cuML、cuGraph、cuVS、cuCIM、KvikIO、Warp、Newton、Numba-CUDA、RAFT 相关问题;以及性能剖析、内存搬运、kernel 或多 GPU 瓶颈。当大规模数据并行的 Python 代码很慢且 GPU 加速是合理选项时也应使用,即使用户没有提到 CUDA。

source

record-browser-gif(浏览器演示 GIF 录制)

SkillSkillsMP

使用可用的浏览器控制工作流,可选 Playwright Videos 提升采集帧率,并以确定性编码把浏览器或 Web UI 交互演示录制为优化后的 GIF,再用 gh --attach 将 GIF 附到 PR 上;无法附加时回退到专用 assets 分支。在被要求制作、录制或生成演示浏览器工作流的 GIF 时使用;凡改动面向产品用户的 GUI 行为的 PR,都必须附带从该 PR 真实服务端与模型流程录制的 GIF。

source

dsh-trim-cot-leakage(推理痕迹清理)

SkillSkillsMP

在审计或修正读起来像泄漏推理记录的文案时使用——例如(决策 N)、审计条目编号等指向未提交草稿的陈旧设计会话引用;used to、no longer、this cut 之类的变更叙述;基于栈或评审视角的表述(本 stack 中后续的 PR、评审中被否决);面向评审者的辩解;控制流叙述;以及注释、JSDoc、文档、Agent Notes 中残留的规划性试探语气。

source

常见问题

Figma MCP 需要什么权限?

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

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

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

生成图片的 MCP 会侵权吗?

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

配套安装与配置教程

相关场景