產生符合設計系統規範的一致且可存取的 UI 元件。確保每個元件具有視覺獨特性、品牌一致性和可存取性合規性。

為 React 應用程式建立一致且具響應性的樣式需要理解多種 CSS 方法。此技能提供可立即使用的 Tailwind CSS、CSS Modules 和元件變體模式,以提升開發速度。

不再需要從零開始手動編寫 UI 元件。此技能使用 shadcn/ui 和現代最佳實踐，生成無障礙、響應式的 UI 元件和意見回饋表單。

建立 3D 網頁內容需要了解 WebGL、著色器和 3D 圖形程式設計。此技能使用現代 ES 模組生成完整的 Three.js 應用程式,包含場景設定、光照、材質、動畫和響應式渲染。

建立獨特的網頁元件和頁面，展現精緻的美學。避免使用一般的人工智慧生成視覺效果，創造令人難忘的高品質使用者介面。

遊戲開發者需要一致且架構良好的UI組件來構建戰鬥界面。此技能提供完整的實作指南，包括TypeScript接口、CSS Grid佈局、動畫規格和回應式樣式令牌，用於Pattern A戰鬥UI系統。

定義一致的視覺風格對於專案凝聚力至關重要,但許多創作者難以清楚表達其美學願景。此技能提供結構化的10步驟框架,用於建立詳細的美術風格指南,涵蓋色彩理論、線條運用、形狀、構圖、光影及技術規格。

從零開始創建圖片需要時間和技能。這個技能讓你使用自然語言提示透過 Gemini AI 生成圖片。只需描述你想要的內容,幾秒鐘內就能獲得專業的結果。

Teams struggle to choose the right diagram type and end up with confusing models that mix structure, behavior, and interaction. This skill guides you to select the correct UML form, build semantically accurate models, and produce diagrams that communicate clearly to any audience.

為 Slack 製作 GIF 需要仔細最佳化，才能符合嚴格的檔案大小限制。這個工具包提供驗證器、動畫基元與最佳化工具，讓你建立可成功上傳的訊息 GIF 與表情符號反應。

生成藝術創作需要藝術視野和技術能力。此技能可幫助您使用 p5.js 創建獨特且可重現的生成藝術，並提供參數控制以供探索。您可以創建流場、遞歸模式、粒子系統等。

運用精妙的設計理念將創意轉化為令人驚嘆的視覺藝術。此技能引導 AI 創作專業品質的海報和藝術作品，看起來如同大師級設計師精心製作的成品。

您需要在文件或簡報中應用一致的品牌色彩和排版。此技能提供官方的 Anthropic 品牌指南，包括色彩、字體和樣式規則，以確保符合品牌的視覺輸出。

創建演算法藝術需要生成系統、種子隨機性和 p5.js 的專業知識。此技能通過演算法哲學和互動參數探索,提供了一種結構化的方法來創作原創生成藝術作品。

Tailwind CSS V4 透過其 Oxide 引擎與 CSS-first 設定帶來革命性變更。此技能提供專家級指引，協助你完成遷移、最佳化效能並打造現代設計系統。

看起來平淡無奇的介面無法吸引用戶的注意力，也會削弱品牌辨識度。本技能指導 AI 助手建立大膽、令人難忘的前端設計，具有獨特的美學風格、強烈的視覺層次結構，以及可投入生產環境的程式碼品質。

在多個應用程式間建立一致的桌面主題既複雜又耗時。Omarchy 主題提供集中式的 colors.toml 配置,可自動為所有桌面應用程式生成主題,包括終端機、視窗管理器和系統工具。

AI 代理產品常有漫長等待時間，容易造成使用者焦慮與流失。此技能透過瀏覽器自動化稽核應用程式對長時間作業的處理方式，並產出含優先級建議的完整報告。

AI 產生的視覺輸出常有版面、間距和對齊問題，難以手動察覺。此技能會自動擷取結果的螢幕截圖，分析其中的視覺缺陷，並修復所發現的問題。

建立無障礙 React 元件需要了解 ShadCN 模式和 Radix UI 原語。本技能提供使用 TailwindCSS 和 2025 年 11 月標準實作無障礙對話框、表單和其他元件的最佳實踐。