← Back to Skills Marketplace
1407
Downloads
2
Stars
3
Active Installs
1
Versions
Install in OpenClaw
/install stitch-ui-designer
Description
Design, preview, and generate UI code using Google Stitch (via MCP). Helps developers choose the best UI by generating previews first, allowing iteration, and then exporting code.
Usage Guidance
This skill looks like a legitimate UI-design wrapper for Google Stitch, but it depends on two external tools (mcporter and an npm package run via npx) and on your Google Cloud credentials. Before installing or using it: 1) Confirm where mcporter comes from and whether you trust that binary; ask the seller/source for provenance or an install URL. 2) Inspect the stitch-mcp-auto npm package (its npm page, repository, and recent releases) before allowing npx to run it — npx executes remote code. 3) When prompted to run gcloud auth, be mindful of the scopes requested; prefer granting minimal scopes and use a dedicated project/service account, not your personal account. 4) If possible, run initial tests in an isolated environment (throwaway project or VM) to limit blast radius. 5) Ask the skill publisher to declare required env vars (e.g., GOOGLE_CLOUD_PROJECT) and provide install instructions for mcporter to make the integration auditable.
Capability Analysis
Type: OpenClaw Skill
Name: stitch-ui-designer
Version: 1.0.0
The skill instructs the agent to configure `mcporter` to execute `npx stitch-mcp-auto` via `SKILL.md`. This introduces a significant supply chain risk, as `npx` downloads and runs an external npm package (`stitch-mcp-auto`), which could potentially contain malicious code or access sensitive Google Cloud credentials during the `gcloud auth` process. While the stated purpose is benign, the method of executing an arbitrary npm package via `npx` is a high-risk capability.
Capability Assessment
Purpose & Capability
Name/description (design & export UIs via Google Stitch) align with the runtime actions (call stitch.generate_screen_from_text, fetch image/code). Requiring npx and an MCP runner (mcporter) is consistent. However, the SKILL.md references Google Cloud authentication and the GOOGLE_CLOUD_PROJECT env var but the skill lists no required env vars or primary credential — that omission is inconsistent and could hide necessary access to user GCP credentials.
Instruction Scope
The instructions stay within the UI-design flow: configure mcporter, run stitch commands to generate previews and code, and only fetch code after user approval. They do instruct performing gcloud auth and possibly configuring a project ID, which implies use of user Google credentials. The instructions do not request arbitrary filesystem scans or unrelated credentials, but they give the agent discretion to run npx and mcporter commands which may execute arbitrary remote code.
Install Mechanism
There is no install spec (instruction-only), which lowers direct risk, but the skill explicitly instructs using `npx -y stitch-mcp-auto` and `mcporter`. npx will fetch and execute code from the npm registry (remote code execution risk) and mcporter is an unfamiliar binary with no provenance or install guidance in the skill. The skill does not document how mcporter should be obtained or vetted.
Credentials
The skill does not declare required env vars or credentials, yet the README explicitly expects Google Cloud authentication and mentions the GOOGLE_CLOUD_PROJECT env var. Requesting (or prompting for) gcloud auth is appropriate for a Google Stitch integration, but the lack of declared credentials/primaryEnv is a mismatch and prevents informed consent about which secrets will be used or needed.
Persistence & Privilege
The skill is not always-enabled and does not request persistent system configuration in its spec. It permits autonomous invocation (platform default), but nothing in the metadata indicates it would modify other skills or system-wide settings.
How to Use
- Make sure OpenClaw is installed (local or Docker)
- Run the install command in chat:
/install stitch-ui-designer - After installation, invoke the skill by name or use
/stitch-ui-designer - Provide required inputs per the skill's parameter spec and get structured output
Version History
v1.0.0
Initial release of Stitch UI Designer.
- Design and preview user interfaces using Google Stitch via MCP.
- Guide users through setup, including Stitch server configuration and Google auth.
- Generate UI preview images from text descriptions before generating code.
- Support iterative feedback and design refinement through preview cycles.
- Export and present UI code (HTML/CSS) only after user approval.
- Includes essential workflow tips and troubleshooting for project context and authentication.
Metadata
Frequently Asked Questions
What is Stitch Ui Designer?
Design, preview, and generate UI code using Google Stitch (via MCP). Helps developers choose the best UI by generating previews first, allowing iteration, and then exporting code. It is an AI Agent Skill for Claude Code / OpenClaw, with 1407 downloads so far.
How do I install Stitch Ui Designer?
Run "/install stitch-ui-designer" in the OpenClaw or Claude Code chat to install it in one step — no extra setup required.
Is Stitch Ui Designer free?
Yes, Stitch Ui Designer is completely free (open-source). You can download, install and use it at no cost.
Which platforms does Stitch Ui Designer support?
Stitch Ui Designer is cross-platform and runs anywhere OpenClaw / Claude Code is available (cross-platform).
Who created Stitch Ui Designer?
It is built and maintained by Mus Titou (@a2mus); the current version is v1.0.0.
More Skills