stitch::react-native
An agent skill by google-labs-code, from google-labs-code/stitch-skills. Tags: component, design, mobile, react-native, stylesheet.
What it does
Convert Stitch HTML designs to React Native components, or syncs/updates existing native components to align with the latest Stitch designs, using StyleSheet.
Install
With the skills CLI, which installs into Claude Code, Codex, Cursor and other agents:
npx skills add google-labs-code/stitch-skills --skill 'stitch::react-native'Or copy the skill folder into Claude Code's skills directory by hand (~/.claude/skills for every project, or .claude/skills inside one):
git clone --depth 1 https://github.com/google-labs-code/stitch-skills
cp -r stitch-skills/plugins/stitch-build/skills/react-native ~/.claude/skills/'stitch::react-native'Safety box score
Grade C, moderate risk: 39 of 100 risk points, rated 2026-10-19. The grade rates what the skill and its scripts can reach on the machine of whoever installs it, across eight categories from shell execution to secrets access. How the score works.
This skill downloads Stitch HTML/screenshots, audits them, and writes React Native source plus sync metadata into the project. The main risks are network fetches, local command execution (including install/validation tooling), and broad in-repo file edits; it does not ask for secrets or elevated privileges.
| Category | Level | Why |
|---|---|---|
| Code & shell execution | 2 (moderate) | It runs local code via `bash scripts/fetch-stitch.sh ...` and `npm run validate` (`node scripts/validate.js`), and `npm install` is explicitly allowed when `node_modules` is missing. |
| Network access | 2 (moderate) | Phase 1 requires downloading every screen's HTML and screenshots from remote URLs using `curl` in `scripts/fetch-stitch.sh`. |
| Filesystem reach | 2 (moderate) | It creates/updates project files across the tree, including `.stitch/designs/{page}.html/.png`, `.stitch/metadata.json`, `src/theme.ts`, `src/data/mockData.ts`, and component files. |
| Secrets & credentials | 0 (none) | There is no step that reads keychains, token stores, `.env` files, browser sessions, or asks the user to paste credentials. |
| Privilege & persistence | 0 (none) | No sudo, global installs, services, shell startup edits, or OS-level configuration changes are required by the skill itself. |
| Instruction hijack surface | 2 (moderate) | The skill uses forceful workflow constraints like `Do NOT skip any step`, `Reading local files directly ... is PROHIBITED`, and `You MUST ask`, which pressure the agent to follow the skill text over normal shortcuts. |
| Irreversible actions | 1 (low) | Its purpose is to automatically create/update app code from designs, but it does not push, deploy, publish, pay, or message externally. |
| Transparency | 1 (low) | `package-lock.json` pulls in `@swc/core` with `hasInstallScript: true` and many optional native binaries, so part of dependency installation is opaque/platform-specific. |
Before installing
- Review `scripts/fetch-stitch.sh`; it downloads arbitrary URLs with `curl`.
- Expect the skill to write `.stitch/*`, `src/theme.ts`, `src/data/mockData.ts`, and component files in your repo.
- If you will run validation, allow `npm install` first; it pulls in `@swc/core` native binaries.
- Only proceed with remote fetches if you trust the Stitch project/URLs being retrieved.
Rated 2026-10-19 by an automated review of 9 files from the skill's repository.
Source
- Repository
- google-labs-code/stitch-skills (all skills from this repository)
- Path
- plugins/stitch-build/skills/react-native/SKILL.md
- Branch
- main
- Collection
- stitch-build
- Updated
- 2026-09-19
Related skills
- shadcn-ui — Expert guidance for integrating and building applications with shadcn/ui components, including component discovery, installation, customization.
- stitch::react-components — Converts Stitch designs into modular Vite and React components, or syncs/updates existing React components to align with the latest Stitch designs.
- expo-native-ui — Framework (OSS). Build beautiful, native-feeling Expo screens.
- expo-ui — Framework (OSS). Build native UI with the @expo/ui package: real SwiftUI on iOS and Jetpack Compose on Android.
- animate-expo — Build animations in React Native and Expo, making the decisions in the order that determines whether they feel right — should it animate.
- apple-design — Apple's approach to interface design and fluid, physical motion, translated for the web.