Traction scoreGitHub stars can be faked, so popularity alone can be misleading. Traction Score looks for broader signs of recent attention, adoption, and active maintenance.
This collection of skills bridges the gap between design tokens and implementation for frontend engineers. It automates the conversion of Stitch designs into structured code, ensuring that accessible tokens from design documentation are preserved in the final build.
The toolkit supports a range of targets, from mobile interfaces in React Native to complex web dashboards. For data-heavy applications, it integrates TanStack Query and Web3 patterns using ethers or viem to create functional, production-ready interfaces.
Compatible AgentsThe repository documents support for these agents. The skills may also work with other agents that can load SKILL.md files, but they may need some setup or small changes.
Installs: Choose specific skills from google-labs-code/stitch-skills rather than installing a documented plugin bundle. The supplied evidence does not establish the resulting skill-to-path selections.
Before you start
Stitch MCP server configured and running in the agent environment, with the required environment variables and credentials.
All dependencies required by the selected skills must also be included.
Run this command in a terminal and choose the specific skills needed, ensuring their required dependencies are included.
Installs: Install the google-labs-code/stitch-skills plugin collection into the current project. The supplied excerpts do not establish individual plugin-to-skill-path mappings. · Claude Code
Before you start
Stitch MCP server configured and running in the agent environment, with the required environment variables and credentials.
Run from: Current project directory
From the project directory, run this terminal command.
# Claude Code — installs into the current project
npx plugins add google-labs-code/stitch-skills --scope project --target claude-code
Installs: Install the google-labs-code/stitch-skills plugin collection into the current workspace. The supplied excerpts do not establish individual plugin-to-skill-path mappings. · Cursor
Before you start
Stitch MCP server configured and running in the agent environment, with the required environment variables and credentials.
Run from: Current workspace directory
From the workspace directory, run this terminal command.
# Cursor — installs into the current workspace
npx plugins add google-labs-code/stitch-skills --scope workspace --target cursor
Use the stitch::react-components skill to convert all screens in Stitch project `projects/<PROJECT_ID>` into a modular React component system in `<REACT_APP_PATH>`. Replace `<PROJECT_ID>` with the numeric Stitch project ID and `<REACT_APP_PATH>` with the target Vite/React application directory.
Path to an existing Vite, React, and TypeScript scaffold.
Path to the project's DESIGN.md.
Stitch MCP access.
Use the react-vite-dashboard skill to convert Stitch screen `<SCREEN_ID>` from project `<PROJECT_ID>` into React and Vite dashboard components in `<VITE_APP_PATH>`, using the tokens in `<DESIGN_MD_PATH>`. Replace each placeholder with the relevant ID or local path.
Path to an existing project using React 18 or newer and Tailwind CSS 3.0 or newer.
Node.js 18 or newer.
The project's preferred shadcn/ui configuration choices if it is not already initialized.
Use the shadcn-ui skill in the existing React project at `<PROJECT_PATH>` to initialize its configuration if needed and add the button component. Replace `<PROJECT_PATH>` with the project directory and preserve the project's existing styling choices.
Claude
Codex
Cursor
Gemini CLI
OpenCode
Antigravity