Common Stitch Design

Name: Common Stitch Design
Author: HoangNguyen0403

ASecurity

Drive Google Stitch over MCP safely - read screens, write and lint DESIGN.md, create design systems, and fix designs through variants instead of overwriting. Use when reviewing, editing, or generating Stitch screens or DESIGN.md files.

571 stars

0 votes

0 copies

0 views

Added 10/3/2026

developmentrustgonodeapi

Works with

apimcp

Security Analysis

A100/100

Pro scans all 7 files and shows the line behind each finding

Scanned 10/3/2026

$npx -y skills add HoangNguyen0403/agent-skills-standard --skill common-stitch-design --agent claude-code

Installs into .claude/skills of the current project.

Are you the author of Common Stitch Design?

Add the live security badge to your README — it updates automatically with every re-scan.

Security grade badge for Common Stitch Design

[![Security: A — Skills Directory](https://www.skillsdirectory.com/api/skills/hoangnguyen0403-common-stitch-design/badge)](https://www.skillsdirectory.com/skills/hoangnguyen0403-common-stitch-design)

More formats (shields.io, HTML) on the badges page. Keep it an A: scan every change in CI with Pro.

Download with Pro

Files

SKILL.md

---
name: common-stitch-design
description: Drive Google Stitch over MCP safely - read screens, write and lint DESIGN.md, create design systems, and fix designs through variants instead of overwriting. Use when reviewing, editing, or generating Stitch screens or DESIGN.md files.
metadata:
  triggers:
    files:
      - 'DESIGN.md'
      - '.stitch/**'
    keywords:
      - stitch
      - google stitch
      - stitch mcp
      - design.md
      - stitch screen
      - stitch variants
---

# Stitch Design

## **Priority: P1 (HIGH)**

## Preflight

- Stitch tools (`list_projects`, `list_screens`, `get_screen`) must be in the tool list. Missing → `BLOCKED (stitch-mcp)`.
- Endpoint `https://stitch.googleapis.com/mcp`, header `X-Goog-Api-Key`. Config added mid-session loads only after restart. Setup: [Stitch MCP](references/stitch-mcp.md).

## Read

- `list_screens`, then group by `title`: many versions share one title. Confirm the current one with the author; default most recent.
- Screenshot `screenshot.downloadUrl` + `=w390` (phone) or `=w1280` (tablet); HTML `htmlCode.downloadUrl`. Save to `.stitch/review/<YYYY-MM-DD>/`.
- Run `node scripts/audit_html.js <dir>`. Audit output is evidence; screenshots confirm visual judgement.

## Write Safely

- Never overwrite originals. Fix through `generate_variants` (`creativeRange: REFINE`, `variantCount: 1`) or a new design system.
- Explicit approval before `delete_project`, `update_design_system` on an existing asset, or `apply_design_system` to original screens.
- New design system: `create_design_system` with `theme.designMd`, then `update_design_system` on that new asset.
- `apply_design_system` takes screen instance ids from `get_project`, not screen ids.
- Generation takes minutes. On timeout do not retry; poll `get_screen` every 30 s, max 10.
- Variant output includes illustration image screens with null `deviceType`: skip them. Check device class on the screenshot; a `TABLET` request can return `DESKTOP`.

## DESIGN.md

- Google `design.md` format. `npx @google/design.md lint DESIGN.md` must report 0 errors and 0 warnings before upload.
- Every component `backgroundColor`/`textColor` pair must pass contrast. Rules: [DESIGN.md](references/design-md.md).

## Prompting

- Generation prompts: layout and content only. Edit and variant prompts may carry hex values.
- One shared fix block plus per-screen specifics; re-audit after each pass; max 2 `edit_screens` passes on variants only. See [Prompting](references/prompting.md).

## Anti-Patterns

- **No in-place fixes**: editing originals destroys the baseline.
- **No trusting labels**: titles and device labels drift; check screenshots.
- **No unlinted DESIGN.md**: one bad colour pair ships to every screen.

Attribution

HoangNguyen0403

View source See grades on GitHub More from HoangNguyen0403 →

SSkills DirectorySkills Directory

Ship a skill? Prove it's safe.

Free 120-pattern security scan, letter grade, and an embeddable README badge.

Submit a skill

Is this your skill, or is something wrong with this listing? Request removal or report an issue. Author removals are honored within 72 hours.

Comments (0)

No comments yet. Be the first to comment!

--- name: common-stitch-design description: Drive Google Stitch over MCP safely - read screens, write and lint DESIGN.md, create design systems, and fix designs through variants instead of overwriting. Use when reviewing, editing, or generating Stitch screens or DESIGN.md files. metadata: triggers: files: - 'DESIGN.md' - '.stitch/**' keywords: - stitch - google stitch - stitch mcp - design.md - stitch screen - stitch variants --- # Stitch Design ## **Priority: P1 (HIGH)** ## Preflight - Stitch tools (`list_projects`, `list_screens`, `get_screen`) must be in the tool list. Missing → `BLOCKED (stitch-mcp)`. - Endpoint `https://stitch.googleapis.com/mcp`, header `X-Goog-Api-Key`. Config added mid-session loads only after restart. Setup: [Stitch MCP](references/stitch-mcp.md). ## Read - `list_screens`, then group by `title`: many versions share one title. Confirm the current one with the author; default most recent. - Screenshot `screenshot.downloadUrl` + `=w390` (phone) or `=w1280` (tablet); HTML `htmlCode.downloadUrl`. Save to `.stitch/review/<YYYY-MM-DD>/`. - Run `node scripts/audit_html.js <dir>`. Audit output is evidence; screenshots confirm visual judgement. ## Write Safely - Never overwrite originals. Fix through `generate_variants` (`creativeRange: REFINE`, `variantCount: 1`) or a new design system. - Explicit approval before `delete_project`, `update_design_system` on an existing asset, or `apply_design_system` to original screens. - New design system: `create_design_system` with `theme.designMd`, then `update_design_system` on that new asset. - `apply_design_system` takes screen instance ids from `get_project`, not screen ids. - Generation takes minutes. On timeout do not retry; poll `get_screen` every 30 s, max 10. - Variant output includes illustration image screens with null `deviceType`: skip them. Check device class on the screenshot; a `TABLET` request can return `DESKTOP`. ## DESIGN.md - Google `design.md` format. `npx @google/design.md lint DESIGN.md` must report 0 errors and 0 warnings before upload. - Every component `backgroundColor`/`textColor` pair must pass contrast. Rules: [DESIGN.md](references/design-md.md). ## Prompting - Generation prompts: layout and content only. Edit and variant prompts may carry hex values. - One shared fix block plus per-screen specifics; re-audit after each pass; max 2 `edit_screens` passes on variants only. See [Prompting](references/prompting.md). ## Anti-Patterns - **No in-place fixes**: editing originals destroys the baseline. - **No trusting labels**: titles and device labels drift; check screenshots. - **No unlinted DESIGN.md**: one bad colour pair ships to every screen.