stitch::upload-to-stitch
This skill uploads local assets like images, HTML files, and markdown documents to a Stitch project via a Python script, bypassing MCP tool base64 encoding…
Identity proven by GitHub's verified organisation badge (flutter, google)
- Agents
- Claude Code, Codex, Cursor, Gemini CLI, GitHub Copilot, OpenCode
- License
- Apache-2.0 (permissive)
- Pin
- 0337446pinned Oct 9, 2026
- Context cost
- about 950 tokenswhen the skill loads
- GitHub stars
- 8,442on google-labs-code/stitch-skills
- Scripts
- 1 script
What it does
“Upload local assets (images, mockups, extracted HTML, design markdown) to a Stitch project. ALWAYS use this skill when you need to upload visual assets, HTML pages, or design docs to Stitch, particularly when direct MCP tool calls fail or truncate due to base64 token limits.”
Generated summary from the skill's own text
This skill uploads local assets like images, HTML files, and markdown documents to a Stitch project via a Python script, bypassing MCP tool base64 encoding limitations. It handles file type detection, requires API key authentication, and prompts for user confirmation before uploading. The skill supports PNG, JPEG, WebP, HTML, and markdown files.
When to use it
- Uploading visual assets or design files to Stitch projects
- Sending extracted HTML pages when MCP tools fail due to token limits
- Adding design documentation and mockups to design systems
- Attaching generated files with metadata like route paths or source tool
When not to
- When direct MCP tool uploads succeed without reaching token limits
- If Stitch API key is unavailable and cannot be obtained from user
- When uploading unsupported file formats like PDFs or video files
Install
These commands install from the publisher's repository and need no account.
skills CLI
npx skills add google-labs-code/stitch-skills --skill stitch::upload-to-stitchInstalls from the repository's default branch, which may have changed since the commit we checked.
GitHub CLI 2.90 or later
gh skill install google-labs-code/stitch-skills stitch::upload-to-stitch@0337446dadde6f8c94210444e2aa9d546126480fInstalls the commit we checked (0337446).
Copy by hand
Download the folder at 0337446 and put it in .claude/skills/upload-to-stitch for Claude Code and in .agents/skills/upload-to-stitch for Codex, Cursor, Gemini CLI, GitHub Copilot and OpenCode.
Claude Code plugin
/plugin install chrome-devtools-mcp@claude-plugins-officialThe publisher's plugin in Claude's official marketplace. It may hold more than this skill, and we have not pinned it.
Claude Code plugin
/plugin install alloydb-omni@claude-plugins-officialThe publisher's plugin in Claude's official marketplace. It may hold more than this skill, and we have not pinned it.
Claude Code plugin
/plugin install bigquery-data-analytics@claude-plugins-officialThe publisher's plugin in Claude's official marketplace. It may hold more than this skill, and we have not pinned it.
Copy for your agent
A prompt for any coding agent. It installs this skill from GitHub at the pinned commit, copies the files as they are, and runs nothing unless you ask.
Prompt
Install the agent skill "stitch::upload-to-stitch" by Google. Source, pinned to commit 0337446dadde6f8c94210444e2aa9d546126480f: https://github.com/google-labs-code/stitch-skills/tree/0337446dadde6f8c94210444e2aa9d546126480f/plugins/stitch-design/skills/upload-to-stitch 1. Download that folder at exactly this commit. Do not use the default branch. 2. Copy every file unchanged, keeping the folder structure, into .claude/skills/upload-to-stitch/ for Claude Code and .agents/skills/upload-to-stitch/ for Codex, Cursor, Gemini CLI, GitHub Copilot and OpenCode. Create the folders if they do not exist. 3. Do not edit the files, and do not run any script in the folder unless I ask you to. 4. When you are done, list the files you copied and where you put them. Listing and checks: https://www.agentnative.dev/skills/google/stitch-upload-to-stitch
SKILL.md at the pin
--- name: stitch::upload-to-stitch description: >- Upload local assets (images, mockups, extracted HTML, design markdown) to a Stitch project. ALWAYS use this skill when you need to upload visual assets, HTML pages, or design docs to Stitch, particularly when direct MCP tool calls fail or truncate due to base64 token limits. allowed-tools: - "stitch*:*" - "Bash" - "Read" - "Write" - "web_fetch" --- # Upload-to-Stitch Upload local assets (images, mockups, HTML, and markdown files) to a Stitch project using the provided upload script, which bypasses the MCP tool's base64 output token limits. > [!NOTE] > The AI model cannot upload files via MCP tools directly because the base64 > encoding of even a small file exceeds the model's output token limit (~16K > tokens). This script reads the file and sends it directly over HTTP. ## Steps ### 1. Identify Target Project Use `list_projects` to find the correct `projectId`. ### 2. Get the API Key Locate your active MCP server configuration file and extract the API key: - **Antigravity**: `.gemini/antigravity/mcp_config.json` or `.gemini/jetski/mcp_config.json` - **Gemini CLI**: `~/.gemini/settings.json` or `~/.gemini/extensions/Stitch/gemini-extension.json` - **Claude Code**: `~/.claude.json` Extract: - **API Key**: From the `X-Goog-Api-Key` header or auth argument - **MCP URL** (optional): From the `httpUrl` or endpoint argument (defaults to `https://stitch.googleapis.com`) > [!IMPORTANT] > If you cannot find the API key in any of these locations, or if you cannot access these files, you MUST ask the user to provide the Stitch API key. Do not proceed without a valid API key. ### 3. Run Upload Script > [!WARNING] > **Checkpoint — User Confirmation Required.** > Before running the upload script, you **MUST** pause and present the file(s) > to be uploaded (paths, sizes, and types) to the user and wait for explicit > approval. Do **NOT** execute the upload script until the user confirms. Use `run_command` to execute the Python script: ```bash python3 <SKILL_DIR>/scripts/upload_to_stitch.py \ --project-id <PROJECT_ID> \ --file-path <PATH_TO_FILE> \ --api-key <API_KEY> \ [--api-url <STITCH_API_URL>] \ [--title <SCREEN_TITLE>] \ [--generated-by <GENERATED_BY>] ``` > [!TIP] > **macOS / SSL Certificate Troubleshooting:** > If the upload fails with `ssl.SSLCertVerificationError: [SSL: CERTIFICATE_VERIFY_FAILED] unable to get local issuer certificate`, this means your Python installation does not have root certificate authorities configured. > > The script automatically attempts to use the `certifi` package to load the CA bundle if it is installed in your python environment. If `certifi` is not installed, you can either install it (`pip install certifi`) or manually supply the `SSL_CERT_FILE` environment variable when running the script: > ```bash > SSL_CERT_FILE=$(python3 -c "import certifi; print(certifi.where())") python3 <SKILL_DIR>/scripts/upload_to_stitch.py \ > --project-id <PROJECT_ID> \ > --file-path <PATH_TO_FILE> \ > --api-key <API_KEY> \ > [--api-url <STITCH_API_URL>] \ > [--title <SCREEN_TITLE>] \ > [--generated-by <GENERATED_BY>] > ``` ### Supported File Types | Extension | MIME Type | |:---|:---| | `.png` | `image/png` | | `.jpg`, `.jpeg` | `image/jpeg` | | `.webp` | `image/webp` | | `.html`, `.htm` | `text/html` | | `.md` | `text/markdown` | The script auto-detects MIME type from the file extension. ### Script Options - `--project-id`: **Required**. The Stitch project ID. - `--file-path`: **Required**. Path to the local file to upload. - `--api-key`: **Required**. API key for Stitch authorization. - `--api-url`: Optional. Base URL of the Stitch API. Defaults to `https://stitch.googleapis.com`. - `--title`: Optional. Title for the uploaded screen. When uploading extracted HTML from a web app, set this to the **route path** of the page (e.g., `'/dashboard'`, `'/settings/profile'`, `'/inbox'`) so that the screen name/title in Stitch clearly identifies the route. - `--generated-by`: Optional. Specify how the uploaded file was generated (e.g., 'stitch::extract-static-html' skill, 'Claude Code', 'Codex', 'Gemini' etc.).
From google-labs-code/stitch-skills at 0337446, shown as plain text under its license: Apache-2.0 (permissive). The license text is in LICENSE.
View SKILL.md on GitHub at 0337446Files
- SKILL.md4.2 KB · e8ddf11677a9
- scripts/
- upload_to_stitch.py7.4 KB · 8a1313edc967
2 files, 12 KB in total. Each file has a sha256 in the pin's manifest; the first 12 characters are shown.
Skill folder on GitHub at 0337446More from Google
skill-creator
This skill guides agents through creating new skills that extend Gemini CLI with specialized knowledge, workflows, and tool integrations.
Contains scripts
Gemini CLI · about 5K tokens · pinned 6 days ago
chrome-devtools-cli
This skill enables agents to automate browser interactions and inspect web pages using Chrome DevTools via command-line interface.
Claude Code, Codex, Cursor +4 · about 2.9K tokens · pinned 6 days ago
cloud-run-basics
Deploys and manages Google Cloud Run services, jobs, and worker pools for running containerized applications or source code.
Claude Code, Codex, Cursor +4 · about 3.9K tokens · pinned 6 days ago
retail-virtual-tryon
Creates virtual try-on agents on Google Cloud using Gemini image models and Veo video generation, supporting static image try-ons and catwalk animations.
Contains scripts
Claude Code, Codex, Cursor +3 · about 3.3K tokens · pinned 6 days ago
site-md
This skill analyzes project briefs and generates a .stitch/SITE.md constitution file that documents the project's identity, visual direction, architecture…
Claude Code, Codex, Cursor +4 · about 730 tokens · pinned 6 days ago
stitch::code-to-design
This skill converts existing frontend code (React, Vue, Angular, etc.) into a Stitch Design by extracting HTML, analyzing design systems, and uploading both…
Claude Code, Codex, Cursor +4 · about 760 tokens · pinned 6 days ago
Related in Frontend and design
web-perf
Audits website performance by analyzing Core Web Vitals, Lighthouse scores, network requests, and trace data using Chrome DevTools.
by CloudflareOfficial publisher
Claude Code, Codex, Cursor +4 · about 2K tokens · pinned 6 days ago
figma-design-to-code
This skill provides the agent with detailed procedures for converting Figma designs into code.
by FigmaOfficial publisher
Claude Code · about 860 tokens · pinned 6 days ago
figma-generate-library
Orchestrates multi-phase design system builds in Figma from code.
by FigmaOfficial publisher
Contains scripts
Claude Code · about 5.8K tokens · pinned 6 days ago
figma-generate-library
Builds or updates professional design systems in Figma from code by creating variables, tokens, components with variants, semantic aliases, and documentation.
by FigmaOfficial publisher
Contains scripts
Claude Code · about 5.9K tokens · pinned 6 days ago
figma-use-motion
This skill adds motion and animation capabilities to Figma node editing, enabling the agent to create and modify keyframe animations, apply animation styles…
by FigmaOfficial publisher
Claude Code · about 1.6K tokens · pinned 6 days ago
wpds
This skill helps agents build and review UIs using the WordPress Design System, including components, tokens, and patterns.
by AutomatticOfficial publisher
Claude Code, Codex, Cursor +4 · about 640 tokens · pinned 6 days ago
Open roles at Google
No open roles at Google on the Agent Native jobs board right now.
Browse the jobs board