Token导航 LogoToken导航TokenDH.com
图像处理external-servicegithub未标认证来源可访问许可证需确认审计通过

stitch-mcp-upload-screens-from-imagesstitch MCP upload screens from images 图像

Agent Skill

用于辅助图像生成、图片编辑、视觉素材处理或图像模型工作流。它适合让 Agent 根据文本生成图片、处理背景、整理视觉提示词或调用相关图像工具。使用时需要确认输入图片、版权来源、输出格式和模型限制;涉及人物、品牌、商品或公开展示素材时,应额外核对授权、真实性和内容合规边界。

总安装

423

周安装

18

GitHub Stars

22

下载量

148
CodexClaudeCursorGemini CLI

安装说明

本站只整理中文说明和来源信息,不托管安装包,也不代用户安装。

GitHub

来源数

2

许可证

unknown

最后核验

2026-05-01

来源状态

来源可访问

安装方式

通过对话安装

复制提示词发给支持本地命令或 Skills 的 AI 助手,先确认命令和权限,再让它执行。

请帮我安装这个 Agent Skill:stitch-mcp-upload-screens-from-images(stitch MCP upload screens from images 图像)
来源仓库:https://github.com/gabelul/stitch-kit
仓库路径:skills/stitch-mcp-upload-screens-from-images
安装命令:
npx skills add https://github.com/gabelul/stitch-kit --skill stitch-mcp-upload-screens-from-images
安装前请先检查当前环境是否支持对应 CLI,并向我确认将要执行的命令、安装目录、联网范围和文件读写权限;确认后再执行。

命令行安装

复制命令到本机终端执行。该命令会通过 npx skills 从第三方来源获取 Skill;本站只展示命令,不托管安装包,也不自动执行。

skills.shnpx skills
npx skills add https://github.com/gabelul/stitch-kit --skill stitch-mcp-upload-screens-from-images

简介

用于辅助图像生成、图片编辑、视觉素材处理或图像模型工作流。

  • 它适合让 Agent 根据文本生成图片、处理背景、整理视觉提示词或调用相关图像工具。
  • 使用时需要确认输入图片、版权来源、输出格式和模型限制。
  • 涉及人物、品牌、商品或公开展示素材时,应额外核对授权、真实性和内容合规边界。
  • stitch-mcp-upload-screens-from-images 属于图像处理类 Skill,可作为该场景下的辅助能力补充。

SKILL.md

Stitch MCP — Upload Screens from Images

Uploads one or more images (screenshots, mockups, wireframes) into a Stitch project as new screens. This is the entry point for the "redesign existing UI" workflow — import what you have, then use edit_screens to iterate or convert directly to code.

Critical prerequisite

Only use this skill when the user explicitly mentions "Stitch".

You must have a projectId before calling this. If you don't have one:

  • Create a new project via stitch-mcp-create-project
  • Or find an existing project via stitch-mcp-list-projects

When to use

  • User provides a screenshot and wants to redesign it in Stitch
  • User wants to import existing mockups into Stitch for editing
  • The orchestrator classifies intent as "Upload screenshot"
  • User says "import this design", "upload this image", or "redesign this screen"

Step 1: Encode the image to base64

Use the helper script to convert a local image file to base64:

bash scripts/encode-image.sh "path/to/screenshot.png"

The script outputs raw base64 to stdout. Capture it for the API call.

Supported formats and their MIME types:

ExtensionMIME type
.pngimage/png
.jpg, .jpegimage/jpeg
.webpimage/webp
.gifimage/gif

Step 2: Call the MCP tool

{
  "name": "upload_screens_from_images",
  "arguments": {
    "projectId": "3780309359108792857",
    "images": [
      {
        "fileContentBase64": "[base64-encoded-image-data]",
        "mimeType": "image/png"
      }
    ]
  }
}

projectId — numeric ID only, no prefix

✅ "3780309359108792857"
❌ "projects/3780309359108792857"

images — array of image objects

Each image needs:

FieldTypeDescription
fileContentBase64stringBase64-encoded image data (no data: prefix)
mimeTypestringMIME type matching the image format

You can upload multiple images in a single call — each becomes a separate screen.

Output

Returns session info similar to generate_screen_from_text. The uploaded images appear as new screens in the project.

After uploading

  1. Call stitch-mcp-list-screens to find the new screen IDs
  2. Offer the user:

- "Edit this screen (change colors, layout, content)?" → stitch-mcp-edit-screens - "Convert directly to code?" → stitch-mcp-get-screen → framework conversion - "Generate variants based on this design?" → stitch-mcp-generate-variants

References

  • scripts/encode-image.sh — Base64 encoding helper

适合场景

01

用户想查找某类 Agent Skill 时

02

需要根据任务场景推荐可安装能力包时

03

需要对比不同来源的安装命令和来源信息时

能力概览

能力 1

按任务关键词查找相关 Skills

能力 2

展示可复制的安装命令

能力 3

保留来源站点、仓库和原始说明,方便继续核验

能力 4

展示第三方安全扫描或审计结果

安装后应在对应宿主中按原始 README 的触发条件使用;具体调用方式请以来源页面和 README 为准。

平台分布

Codex

35.36%
按下载量换算52

Claude

27.07%
按下载量换算40

Cursor

20.26%
按下载量换算30

Gemini CLI

10.1%
按下载量换算15

安全审计

Gen Agent Trust Hub

通过

Socket

通过

Snyk

通过

权限和风险

external-service

该 Skill 可能调用第三方服务、云服务或外部模型 API,使用前需要确认账号、额度、数据发送范围和服务条款。

安装前确认

本站仅展示第三方公开信息,不托管安装包,不提供自动安装或运行环境。安装前应自行审查源码、依赖和命令行为。当前只有一个来源,正式发布前建议补源仓库或其他目录站核验。

来源信息

继续浏览同类 Skills