# stitch-skills — Agent Skills for Stitch MCP

> stitch-skills is a library of agent skills designed for the Stitch MCP server. Install with the skills CLI and apply design/frontend skills on demand.

## Install

Save the content below to `.claude/skills/` or append to your `CLAUDE.md`:

# stitch-skills — Agent Skills for Stitch MCP

> stitch-skills is a library of agent skills designed for the Stitch MCP server. Install with the skills CLI and apply design/frontend skills on demand.

## Quick Use

1) Install

```bash
npx skills add google-labs-code/stitch-skills --list
```

2) Run

```bash
npx skills add google-labs-code/stitch-skills --skill stitch-design --global
```

3) Verify

```bash
Confirm the installed skill appears in your agent's skills directory
```

---

## Intro

**Best for**: teams using Stitch MCP who want reusable, installable skills instead of copying prompts across repos

**Works with**: Node.js + npx, the `skills` CLI, Stitch MCP workflows; supports multiple agent directories via auto-detection

**Setup time**: 7 minutes

### Quant Data

- Install via `npx skills add ...` (repo)
- Includes design + frontend skills like `react:components` (repo)

---

## How to Use It Well

Treat skills as versioned operational playbooks. Pick 1–2 that match your workflow (design loop, component generation), then iterate and keep diffs reviewable.

### Adoption Checklist

- Start with one real task and keep the scope narrow
- Capture a baseline: time-to-first-success and output quality
- Version your config/skills so teammates stay in sync

### Guardrails

Avoid installing dozens at once. Keep the active set small, and document when each skill should be used.

### FAQ

**Q: Do I need Stitch MCP to use these skills?**
A: They are designed for Stitch workflows; you can still read the prompts, but the best experience is with Stitch MCP available.

**Q: How do I pick a skill?**
A: List skills first, then install one skill globally. Start with `stitch-design` as the unified entry point.

**Q: Can I uninstall cleanly?**
A: Yes. Use the `skills` CLI to remove or reinstall; keep skills in version control if you standardize them across a team.

---

## Source & Thanks

> GitHub: https://github.com/google-labs-code/stitch-skills
> Owner avatar: https://avatars.githubusercontent.com/u/161364575?v=4
> License (SPDX): Apache-2.0
> GitHub stars (verified via `api.github.com/repos/google-labs-code/stitch-skills`): 5,339


---

<!-- ZH -->

# stitch-skills——Stitch MCP 的技能库

> stitch-skills 是为 Stitch MCP server 设计的一套 Agent Skills 库。用 skills CLI 安装到 Claude Code/Codex 等客户端，并按需调用设计与前端类技能。

## 快速使用

1）安装

```bash
npx skills add google-labs-code/stitch-skills --list
```

2）运行

```bash
npx skills add google-labs-code/stitch-skills --skill stitch-design --global
```

3）验证

```bash
Confirm the installed skill appears in your agent's skills directory
```

---

## 简介

**适合谁**：使用 Stitch MCP 的团队，希望用可安装的技能替代跨仓库复制提示词

**适用环境**：Node.js + npx、`skills` CLI、Stitch MCP 工作流；可自动识别多种 agent 目录并安装

**安装耗时**：7 分钟

### 量化信息

- 可用 `npx skills add ...` 安装（仓库）
- 包含设计/前端类技能（如 `react:components`，仓库）

---

## 用好它的方式

把技能当成可版本化的操作手册：先选 1–2 个最贴合流程的技能（设计 loop / 组件生成），迭代时保持 diff 可 review。

### 推广清单

- 先选一个真实任务，小范围试跑
- 记录基线：首次成功耗时与输出质量
- 配置/技能要版本化，避免团队漂移

### 风险与护栏

不要一次装太多。保持活跃技能集足够小，并写清每个技能的适用场景。

### FAQ

**Q: 必须有 Stitch MCP 才能用吗？**
A: 这些技能为 Stitch 工作流设计；你也能直接阅读提示词，但最好的体验是配合 Stitch MCP 使用。

**Q: 怎么选技能？**
A: 先 `--list` 查看，再全局安装一个技能。建议从统一入口 `stitch-design` 开始。

**Q: 能否干净卸载？**
A: 可以。用 `skills` CLI 移除或重装；如果团队要标准化，建议把选定技能纳入版本管理。

---

## 来源与感谢

> GitHub：https://github.com/google-labs-code/stitch-skills
> Owner avatar：https://avatars.githubusercontent.com/u/161364575?v=4
> 许可证（SPDX）：Apache-2.0
> GitHub stars（已通过 `api.github.com/repos/google-labs-code/stitch-skills` 核验）：5,339


---
Source: https://tokrepo.com/en/workflows/stitch-skills-agent-skills-for-stitch-mcp
Author: Skill Factory