Awesome Stitch リソース
Google Stitch と AI デザインの厳選リソース —— 公式ドキュメント、ツール、デザインシステム、学習資料。
31 件のリソース
🐙GitHub オープンソース(8)
davideast/stitch-mcp (925 ⭐)
Stitch MCP Server — AI コーディングエージェントを Stitch のデザインに接続する CLI ツール。ローカルプレビューとサイトビルドに対応。
github.comgoogle-labs-code/stitch-skills (6.4k ⭐)
Google 公式の Agent Skills ライブラリ。Stitch のデザイン、ビルド、ツール系スキルを収録し、Codex/Claude/Cursor に対応。
github.comgoogle-labs-code/stitch-sdk
Google 公式の Stitch Node.js SDK。画面生成、編集、バリアント作成、HTML 抽出に対応。
github.comgoogle-labs-code/design.md
DESIGN.md のオープン仕様。Markdown でデザインシステムを定義し、AI エージェントが直接読み取れます。
github.comKargatharaakash/stitch-mcp (115 ⭐)
汎用 Stitch MCP Server。Cursor、Claude、Antigravity など MCP 対応エディタ全般で利用可能。
github.comzyvralabs/pi-stitch-tools
Pi プラットフォーム向けの Stitch 統合ツールキット。14 個の Stitch ツールコマンドを提供。
github.comtygwan/awesome-stitch-design
Stitch リソースのキュレーションリスト。公式リソース、チュートリアル、SDK、ツール、プロンプトテンプレートを収録。
github.comtygwan/stitchkit
Claude Code プラグイン。Stitch と Figma のデザインワークフローを統合し、スキル、エージェント、MCP 設定を収録。
github.com📖ガイドとチュートリアル(7)
How to Use Google Stitch (2026): The Complete Guide
登録から高度な機能までを網羅した Stitch 完全ガイド。マルチスクリーン生成と音声入力も解説。
justinmckelvey.comGoogle Stitch MCP Setup Guide — Claude Code, Cursor, Gemini CLI
Stitch MCP の全プラットフォーム設定ガイド。自動インストール、手動設定、UI 生成の例を収録。
sotaaz.comGoogle Stitch MCP: Design-to-Code in 23 Minutes (2026)
空白のキャンバスからアプリのデプロイまでを23分でたどる Stitch MCP ワークフローチュートリアル。
byteiota.comGoogle Stitch AI Design Tool Pipeline | Complete Guide
PRD からアプリデザイン、そして動作するコードまでをカバーする AI パイプラインのチュートリアル。
productivetechtalk.comTutorial: Google Stitch 2.0 + Claude Code Web Design
Google Stitch 2.0 と Claude Code を使った Web デザインの実践チュートリアル。
marketingagent.blogTutorial: Build Websites with Google Stitch & AI Studio
Google Stitch でデザインシステムを生成し、そのまま AI Studio に渡して React アプリを構築する方法。
marketingagent.blogGoogle Labs Stitch DESIGN.md Goes Open Source: A Deep Dive
開発者視点で Stitch の DESIGN.md オープン仕様と、UI デザインシステムへの影響を深掘り。
vucense.com📚サイト内学習リソース(3)
Stitch プロンプトチュートリアル(当サイト)
サイト内4 章 12 レッスンの体系的なチュートリアル。基礎から応用まで Google Stitch プロンプトを習得。
stitchprompt.comStitch プロンプトスタイル集(当サイト)
サイト内160 種類以上の UI スタイルの Stitch プロンプトテンプレート。EC、SNS、ダッシュボードなどのシーンをカバー。
stitchprompt.comStitch プロンプトエディタ(当サイト)
サイト内オンラインで Stitch プロンプトを編集・最適化。55 個のクイックテンプレートと AI サジェストに対応。
stitchprompt.com🔖Google Stitch 公式リソース(8)
Google Stitch 公式サイト
Google Stitch の公式サイト。AI 駆動の UI デザイン生成プラットフォームで、無料で利用できます。
stitch.withgoogle.comGoogle Stitch 公式ドキュメント
Stitch の公式ドキュメント。プロンプトガイド、マルチスクリーン生成、音声入力などのチュートリアルを収録。
stitch.withgoogle.comStitch MCP 連携ドキュメント
Stitch MCP Server の公式設定ガイド。Claude Code、Cursor、Gemini CLI などのコーディングツールと接続できます。
stitch.withgoogle.comFrom idea to app: Introducing Stitch
Google 公式ブログによる Stitch の紹介 —— アイデアからアプリへ、UI デザインの新しいアプローチ。
developers.googleblog.comStitch AI UI Design の大型アップデート
Google 公式ブログが Stitch AI UI Design の大型アップデートと新機能を発表。
blog.googleDESIGN.md のオープンソース化
Stitch の DESIGN.md デザインシステム形式が正式にオープンソース化。クロスプラットフォームで利用できます。
blog.googleGoogle Labs
Google Labs の実験的プロダクトプラットフォーム。Stitch のアーリーアクセス窓口です。
labs.googleAntigravity (Design-to-Code)
Google Labs のデザイン to コードツール。Stitch と組み合わせてエンドツーエンドの開発を実現します。
labs.google🛠️ツールと拡張機能(3)
Stitch to Figma(19.9k ユーザー)
Figma プラグイン。Stitch が生成した HTML デザインをネイティブな Figma フレームに変換し、Auto Layout、Flexbox、Grid に対応。
figma.comStitch HTML & Web to Figma(10.5k ユーザー)
HTML コードと Web ページの URL を編集可能な Figma デザインに変換。視覚的な階層とレスポンシブレイアウトを維持します。
figma.comhtml.to.design
Stitch からエクスポートした ZIP ファイルを Figma にドラッグするだけで、整った構造と Auto Layout のデザインを生成。
html.to.design