Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx skills add gabelul/stitch-kit --skill stitch-mcp-generate-variantsgit clone --depth 1 https://github.com/gabelul/stitch-kitWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/skills/gabelul/stitch-kit/stitch-mcp-generate-variants)<a href="https://agentmods.dev/skills/gabelul/stitch-kit/stitch-mcp-generate-variants"><img src="https://agentmods.dev/badge/skills/gabelul/stitch-kit/stitch-mcp-generate-variants/github.svg" alt="Measured on agentmods" height="20"></a>Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.
<a href="https://agentmods.dev/skills/gabelul/stitch-kit/stitch-mcp-generate-variants"><img src="https://agentmods.dev/badge/skills/gabelul/stitch-kit/stitch-mcp-generate-variants.svg" alt="Reviewed on agentmods" width="80" height="20"></a>- NVIDIA SkillSpector pass
What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.00039 | $0.01192 |
| Opus 5 | $0.00019 | $0.00596 |
| Sonnet 5 | $0.00008 | $0.00238 |
| Haiku 4.5 | $0.00004 | $0.00119 |
Grade A, and why
stitch-mcp-generate-variants scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 10d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 126 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Stitch MCP — Generate Variants
Generates alternative versions of existing screens using Stitch's native variant generation API. This is more efficient than the text-prompt approach (1 API call vs. 3) and offers fine-grained control over what aspects to vary.
Critical prerequisite
Only use this skill when the user explicitly mentions "Stitch".
You must have both a projectId AND at least one screenId of an existing screen. Variants are always based on an existing design — you can't generate variants from scratch.
When to use
- User wants to explore alternative versions of an existing screen
- After generation, user says "show me some variations" or "try different styles"
- The orchestrator's Step 5b offers "Generate variants"
- A/B testing — creating multiple options for stakeholder review
Call the MCP tool
{
"name": "generate_variants",
"arguments": {
"projectId": "3780309359108792857",
"selectedScreenIds": ["88805abc123def456"],
"prompt": "Explore different color schemes while keeping the layout structure",
"variantOptions": {
"variantCount": 3,
"creativeRange": "EXPLORE",
"aspects": ["COLOR_SCHEME", "IMAGES"]
},
"deviceType": "DESKTOP",
"modelId": "GEMINI_3_1_PRO"
}
}
Parameter reference
projectId — numeric ID only, no prefix
✅ "3780309359108792857"
❌ "projects/3780309359108792857"
selectedScreenIds — array of numeric screen IDs
✅ ["88805abc123def456"]
❌ ["projects/123/screens/88805abc123def456"]
The source screen(s) to generate variants from.
prompt — optional guidance for variant direction
Provide context about what kind of variations the user wants. The variantOptions do the heavy lifting, but the prompt adds nuance.
variantOptions — controls what and how much to vary
| Field | Type | Values | Description |
|---|---|---|---|
variantCount |
int | 1–5 | Number of variants to generate |
creativeRange |
enum | REFINE, EXPLORE, REIMAGINE |
How much to deviate from the original |
aspects |
array | See below | Which design aspects to vary |
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 10d ago First seen · 126 lines · 39 tokens per session scan A c7aa9af47a46
stitch-mcp-generate-variants is a skill published in the GitHub repository gabelul/stitch-kit (45 stars, last pushed 1mo ago), licensed Apache-2.0. It adds 39 tokens to every session and 1,192 once invoked, about $0.0002 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.
Other skills, from other repositories
design-to-code
Mockup-to-component pipeline using Google Stitch, 21st.dev, and Storybook MCP. Accepts a screenshot, a description, or a URL and produces production-ready React components, checking existing Storybook components before generating anything new. Use when implementing UI from a mockup or screenshot. To call the MCP tool…
kit-montar
Monta um site novo combinando peças já validadas do acervo pessoal do usuário — templates, design systems, componentes, animações, menus, prompts e receitas — em vez de gerar tudo do zero. Acervo vazio: constrói do zero e oferece guardar. Recebe o briefing, decide cor e tipografia antes da identidade, pergunta que…
kit-buscar
Consulta o acervo pessoal de sites do usuário — o que ele já guardou: templates rodáveis, design systems com paleta e tipografia, componentes de UI e de IA, animações de scroll, texto e menu, efeitos WebGL, prompts de página inteira e receitas de composição que já deram certo. Responde "o que eu já tenho pronto pra…
kit-cor
Define a paleta do site como decisão, não como consequência de ter escolhido um design system. Faz as perguntas que determinam cor (o que a marca promete, o que o setor já usa, para onde o olho tem que ir, o que ela NÃO pode parecer), monta a paleta por papel — fundo, tinta, superfície, acento — mede o contraste de…
kit-tipo
Define a tipografia do site como decisão — e, principalmente, resolve se dá para ENTREGAR. Confere licença (site de marca paga por tipo, e acervo montado a partir de site de marca vem cheio de fonte comercial que não se pode servir), propõe substituto livre com critério de desenho, monta o par display + corpo, gera a…
stitch-react-native
Convert Stitch HTML designs into React Native screens, or sync existing native components to updated Stitch designs, using native primitives, StyleSheet rules, and mobile platform checks.