G

Google Labs Code技能

agent-dx-cli-scale
google-labs-code
一種評分量表,用於評估命令列介面針對AI代理的設計優劣,依據「Rewrite Your CLI for AI Agents」原則制定。
official
agent-dx-cli-scale
google-labs-code
一個基於「為AI代理重寫你的CLI」原則,用於評估CLI對AI代理設計優劣的評分量表。
official
automate-github-issues
google-labs-code
使用並行的 Jules 編碼代理設置自動化的 GitHub 問題分類與解決。
official
design-md
google-labs-code
Analyze Stitch design projects and generate semantic DESIGN.md files as prompting source of truth. Retrieves screen metadata, HTML/CSS source, and design assets from Stitch projects via MCP Server tools to extract design tokens and visual patterns Synthesizes findings into structured DESIGN.md files covering atmosphere, color palette with hex codes, typography, component styling, and layout principles Translates technical values (Tailwind classes, border-radius, shadows) into evocative...
official
design-md
google-labs-code
分析 Stitch 設計專案,並生成語意化的 DESIGN.md 檔案,作為提示的真實來源。透過 MCP Server 工具從 Stitch 專案中擷取螢幕元資料、HTML/CSS 原始碼及設計素材,以提取設計標記與視覺模式。將分析結果綜合為結構化的 DESIGN.md 檔案,涵蓋氛圍、含十六進位色碼的調色盤、字體排版、元件樣式及佈局原則。將技術數值(Tailwind 類別、邊框圓角、陰影)轉譯為具象徵性的...
official
enhance-prompt
google-labs-code
Transforms vague UI ideas into polished, Stitch-optimized prompts with design system context. Assesses missing elements (platform, page type, visual style, colors, components) and fills gaps systematically Checks for and integrates DESIGN.md files to ensure consistency across multi-page projects Applies enhancement techniques including UI/UX keyword specificity, mood amplification, page structure organization, and proper color formatting Outputs structured prompts ready for Stitch...
official
enhance-prompt
google-labs-code
將模糊的UI想法轉化為精緻、經Stitch優化的提示,並融入設計系統背景。評估缺失元素(平台、頁面類型、視覺風格、顏色、組件),並系統性地填補空白。檢查並整合DESIGN.md檔案,以確保多頁面專案的一致性。應用增強技術,包括UI/UX關鍵字具體化、氛圍強化、頁面結構組織及正確的顏色格式。輸出結構化提示,準備好供Stitch使用...
official
github-codebase-briefing
google-labs-code
此技能對儲存庫進行「深度閱讀」。它避免表面化的列舉,而是先理解專案的架構,再根據該脈絡評估未解決的事項。
official
ink
google-labs-code
用於 json-render 的 Ink 終端渲染器,可將 JSON 規格轉換為互動式終端 UI。適用於使用 @json-render/ink 從…構建終端 UI 時。
official
ink
google-labs-code
Ink 終端渲染器,用於 json-render,可將 JSON 規格轉換為互動式終端 UI。在處理 @json-render/ink、從……建置終端 UI 時使用。
official
local-action-verification
google-labs-code
使用 act 建立本地 GitHub Actions 驗證儲存庫,讓 Jules 能在推送前驗證 CI
official
react-vite-dashboard
google-labs-code
Convert Stitch designs into production React + Vite dashboards with TanStack Query, accessible tokens from DESIGN.md, and Web3-ready patterns (ethers/viem).
official
react:components
google-labs-code
react:components — 一個可安裝的 AI 代理技能,由 google-labs-code/stitch-skills 發布。
official
remotion
google-labs-code
使用 Remotion 從 Stitch 應用程式設計中建立專業的逐步解說影片,包含流暢的轉場與文字疊加。從 Stitch 專案中擷取畫面,並將其編排成 Remotion 影片組合,支援縮放效果、淡入淡出轉場及情境文字疊加。支援模組化元件架構,包含 ScreenSlide 與 WalkthroughComposition 元件,以及互動式熱點與旁白整合等進階功能。產生畫面清單、下載...
official
remotion
google-labs-code
Create professional walkthrough videos from Stitch app designs using Remotion with smooth transitions and text overlays. Retrieves screens from Stitch projects and orchestrates them into Remotion video compositions with zoom effects, fade transitions, and contextual text overlays Supports modular component architecture with ScreenSlide and WalkthroughComposition components, plus advanced features like interactive hotspots and voiceover integration Generates screen manifests, downloads...
official
shadcn-ui
google-labs-code
Expert guidance for discovering, installing, and customizing shadcn/ui components in your project. shadcn/ui is a copy-paste component collection, not a library—components live in your codebase for full ownership and customization without version lock-in Includes 50+ accessible, pre-built components (buttons, dialogs, forms, tables, etc.) built on Radix UI or Base UI primitives with Tailwind CSS styling Supports theme customization via CSS variables, component variants with...
official
shadcn-ui
google-labs-code
在您的專案中探索、安裝及自訂 shadcn/ui 元件的專家指引。shadcn/ui 是一個複製貼上元件集合,而非函式庫——元件直接存在於您的程式碼庫中,讓您擁有完整所有權與自訂能力,無需擔心版本鎖定。包含 50 多個可存取的預建元件(按鈕、對話框、表單、表格等),基於 Radix UI 或 Base UI 基礎元件建構,並採用 Tailwind CSS 樣式。支援透過 CSS 變數進行主題自訂,以及元件變體等功能...
official
stitch-design
google-labs-code
統一的設計系統入口,用於透過 Stitch MCP 建立與編輯高保真 UI 畫面。將粗略的設計想法轉化為結構化提示,使用專業 UI/UX 術語與設計系統背景。將現有 Stitch 專案整合為 .stitch/DESIGN.md「真相來源」文件,確保各畫面一致性。智慧路由請求,在文字轉設計生成、畫面編輯與設計系統文件工作流程之間切換。自動管理資產,透過...
official
stitch-loop
google-labs-code
Autonomous website builder using iterative Stitch generation with baton-passing loop coordination. Implements a relay pattern where each agent iteration reads a task from .stitch/next-prompt.md , generates a page via Stitch MCP, integrates it into the site, and writes the next task for continuation Manages Stitch project state through .stitch/metadata.json , persisting project IDs, screen metadata, and design theme across iterations Requires .stitch/DESIGN.md (visual design system) and...
official
stitch-loop
google-labs-code
自主網站建置工具,採用疊代式Stitch生成與接力傳遞循環協調。實作中繼模式,每次代理疊代從.stitch/next-prompt.md讀取任務,透過Stitch MCP生成頁面,整合至網站,並寫入下一任務以持續進行。透過.stitch/metadata.json管理Stitch專案狀態,跨疊代保留專案ID、畫面元資料與設計主題。需具備.stitch/DESIGN.md(視覺設計系統)及...
official
stitch-sdk-bug-bash
google-labs-code
Find bugs in the Stitch SDK using a real API key. Covers standard functional edges and tricky situations.
official
stitch-sdk-bug-bash
google-labs-code
使用真實API金鑰找出Stitch SDK中的錯誤,涵蓋標準功能邊界與棘手情況。
official
stitch-sdk-development
google-labs-code
Develop the Stitch SDK. Covers the generation pipeline, dual modality (agent vs SDK), error handling, and Traffic Light (Red-Green-Yellow) implementation…
official
stitch-sdk-development
google-labs-code
開發 Stitch SDK。涵蓋生成管道、雙模態(代理 vs SDK)、錯誤處理以及交通燈(紅-綠-黃)實作…
official
stitch-sdk-domain-design
google-labs-code
Design the domain model for the Stitch SDK. Use when mapping MCP tools to domain classes and bindings in domain-map.json. This is Stage 2 of the generation…
official
stitch-sdk-domain-design
google-labs-code
為 Stitch SDK 設計領域模型。用於將 MCP 工具映射到 domain-map.json 中的領域類別與綁定。這是生成流程的第二階段…
official
stitch-sdk-pipeline
google-labs-code
執行完整的 Stitch SDK 生成管線。當新增工具或需要從頭到尾重新生成 SDK 時使用。
official
stitch-sdk-pipeline
google-labs-code
執行完整的 Stitch SDK 生成流程。當新增工具或需要從頭到尾重新產生 SDK 時使用。
official
stitch-sdk-readme
google-labs-code
為 Stitch SDK 產生或更新 README。使用 Bookstore Test 結構,並從程式碼庫中取得當前 API。當 README 需要…時使用。
official
stitch-sdk-readme
google-labs-code
Generate or update the README for the Stitch SDK. Use the Bookstore Test structure and source the current API from the codebase. Use when the README needs to…
official
stitch-sdk-usage
google-labs-code
Use the Stitch SDK to generate, edit, and iterate on UI screens from text prompts, manage projects, and retrieve screen HTML/images. Use when the user wants to…
official
stitch-sdk-usage
google-labs-code
stitch-sdk-usage — 一個可安裝的 AI 代理技能,由 google-labs-code/stitch-sdk 發布。
official
stitch::code-to-design
google-labs-code
將前端程式碼(Vite、React 等)轉換為 Stitch Design,透過鏈式提取靜態 HTML、設計系統及檔案上傳。**務必**使用此…
official
stitch::extract-design-md
google-labs-code
從前端原始碼中直接提取全面的設計系統(DESIGN.md)——支援 React、Vue、Svelte、Angular、純 HTML/CSS 或任何網頁框架。
official
stitch::extract-static-html
google-labs-code
從建置好的網頁應用程式或 React 元件中,提取自包含的靜態 HTML,並將 CSS 與圖片內嵌。當你需要擷取…時,請使用此技能。
official
stitch::generate-design
google-labs-code
根據文字提示或圖片生成新畫面,使用提示與設計系統代碼編輯現有畫面,並透過 Stitch MCP 生成設計變體。…
official
stitch::manage-design-system
google-labs-code
使用 MCP 工具在 Stitch 中管理設計系統,包括擷取資產、在 Stitch 中建立/更新設計系統,以及將其應用於畫面。
official
stitch::react-components
google-labs-code
將 Stitch 設計轉換為模組化的 Vite 和 React 元件,或同步/更新現有的 React 元件以符合最新的 Stitch 設計,使用…
official
stitch::react-native
google-labs-code
將 Stitch HTML 設計轉換為 React Native 元件,或同步/更新現有原生元件以符合最新的 Stitch 設計,使用 StyleSheet。
official
stitch::upload-to-stitch
google-labs-code
將本地資產(圖片、設計稿、提取的HTML、設計標記文件)上傳至Stitch專案。當需要上傳視覺資產、HTML…時,務必使用此技能。
official
taste-design
google-labs-code
Generates semantic design system files that enforce premium, anti-generic UI standards for Google Stitch screen generation. Produces DESIGN.md files encoding visual atmosphere, color calibration, typography rules, component behaviors, layout principles, and motion philosophy in Stitch-native semantic language Enforces strict anti-patterns: bans generic fonts (Inter, Times New Roman), neon aesthetics, overlapping elements, centered Hero sections, fabricated metrics, and AI copywriting clichés...
official
taste-design
google-labs-code
適用於 Google Stitch 的語意設計系統技能。生成符合代理需求的 DESIGN.md 檔案,強制執行高級、反平庸的 UI 標準 — 嚴格的排版、…
official
tdd-red-green-refactor
google-labs-code
此技能實作了一個結構化框架,用於AI輔助程式設計,確保每一行程式碼都可驗證、具型別且有意義。
official
tdd-red-green-refactor
google-labs-code
此技能實作了一個結構化框架,用於AI輔助程式設計,確保每一行程式碼都可驗證、具備型別且具有明確目的。
official
typed-service-contracts
google-labs-code
Architecture standard for building robust, type-safe TypeScript services using the "Spec and Handler" pattern. Use when building CLIs, libraries, or complex…
official
typed-service-contracts
google-labs-code
Architecture standard for building robust, type-safe TypeScript services using the "Spec and Handler" pattern. Use when building CLIs, libraries, or complex…
official
typed-service-contracts
google-labs-code
使用「規格與處理器」模式建構穩健、型別安全的 TypeScript 服務的架構標準。適用於建構 CLI、函式庫或複雜…
official