最新文章
Google Stitch 教學、案例與最新動態
Google Stitch + OpenCode 實戰：手動安裝 Skills 並設定 MCP
寫給 OpenCode 使用者的 Stitch Skills 手動安裝教學：複製技能目錄、避開命名陷阱（stitch:: 前綴與 kebab-case 驗證）、在 opencode.json 註冊 Stitch MCP，並附上與 Claude Code / Cursor 的安裝對照。
Google Stitch vs Banani：一句話多畫面生成還是 Google 原生畫布？
Banani 用一句提示詞生成多畫面可互動介面，支援從互動生成後續狀態、調整設計 token，並匯出 Figma / HTML / CSS；Stitch 提供更完整的 AI 原生畫布、語音迭代與 Google 工具鏈銜接。多畫面快速發散選 Banani，深度畫布迭代選 Stitch。
Google Stitch vs Flowstep：IDE 內 AI 設計畫布還是 Google 雲端畫布？
Flowstep 把 AI 設計畫布接進開發工作流程：MCP 讓 Cursor、Claude Code 等直接生成與編輯畫面，⌘⇧C 複製到 Figma，風格規範一次設定全程生效；Stitch 是面向所有人的雲端畫布，Google 生態系銜接更順。開發者工作流程選 Flowstep，通用探索選 Stitch。
熱門教學
從入門到精通，系統掌握 Stitch 提示詞
Stitch Prompt
來自風格庫的真實提示詞範本，複製即可使用
Design a Linear-inspired interface. - Dark-mode-native: #08090a marketing background, #0f1011 panel background, #191a1b elevated surfaces; - Inter Variable with "cv01", "ss03" globally — geometric alternates for a cleaner aesthetic; - Signature weight 510 (between regular and medium) for most UI text; - Aggressive negative letter-spacing at display sizes (-1.584px at 72px, -1.056px at 48px); - Brand indigo-violet: #5e6ad2 (bg) / #7170ff (accent) / #828fff (hover) — the only chromatic color in the system. Colors: #010102, #08090a, #0f1011, #191a1b with #010102 accent. Typography: (.
Design a Notion-inspired interface. - NotionInter (modified Inter) with negative letter-spacing at display sizes (-2.125px at 64px); - Warm neutral palette: grays carry yellow-brown undertones (#f6f5f4 warm white, #31302e warm dark); - Near-black text via rgba(0,0,0,0.95) -- not pure black, creating micro-warmth; - Ultra-thin borders: 1px solid rgba(0,0,0,0.1) throughout -- whisper-weight division; - Multi-layer shadow stacks with sub-0.05 opacity for barely-there depth. Colors: #000000f2, #ffffff, #0075de, #213183 with #0075de accent. Typography: NotionInter.
Design a Mintlify-inspired interface. - Inter with tight negative tracking at display sizes (-0.8px to -1.28px) — compressed yet readable; - Geist Mono for code labels: uppercase, 12px, tracked-out, the terminal voice; - Brand green (#18E299) used sparingly — CTAs, hover states, focus rings, and accent touches; - Atmospheric gradient hero with cloud-like green-white wash; - Ultra-round corners: 16px for containers, 24px for featured cards, full-round (9999px) for buttons and pills. Colors: #0d0d0d, #ffffff, #18E299, #d4fae8 with #18E299 accent. Typography: Inter.