使用 React 建立複雜的 HTML 成品需要大量的設定時間和配置。此技能提供自動化腳本來初始化配備 Tailwind CSS 和 shadcn/ui 的 React 專案,然後將所有內容打包成單一可攜式 HTML 檔案,可直接在 Claude 對話中分享。

為簡報創建一致且專業的視覺樣式需要大量時間和設計專業知識。此技能提供 10 個精選的色彩和字體主題,可立即套用至任何作品,並能夠按需生成自訂主題。

使用者需要符合 Slack 尺寸要求的 GIF 來製作反應和訊息。此技能提供工具來建立最佳化的 GIF,包含動畫工具、緩動函數,以及驗證功能以符合 Slack 要求。

用戶難以生成脫穎於一般AI生成設計的前端代碼。此技能指導創建難忘的、生產品質的介面，採用大膽的美學、深思熟慮的排版和精緻的視覺細節。

創作原創視覺藝術作品需要深厚的設計知識和藝術技巧。本技能使用透過形式、色彩和構圖表達的成熟設計理念，生成博物館級別的海報、設計作品和視覺藝術。輸出格式為 PNG 或 PDF。

套用一致的品牌風格需要掌握精確的色彩與字體。此技能提供 Anthropic 的官方品牌指南，讓你能快速為任何成果套用樣式。

使用者想要獨特的生成藝術，但缺乏演算法設計知識。這個技能會使用 p5.js 搭配可重現的種子隨機、流場、粒子系統與互動參數探索，創作原創的演算法藝術，以產出客製化的視覺成果。

建構響應式、無障礙的使用者介面需要深入了解工具類別和設計模式。此技能提供專業指導，涵盖行動裝置優先版面配置、暗色模式支援，以及使用 Tailwind CSS 慣例的元件樣式設計。

團隊在文件、網站和行銷材料中難以維持一致的品牌形象。此技能提供全面的範本和規範，涵蓋標誌使用、色彩配置、Typography和品牌調性，確保所有管道都能呈現專業、統一的品牌識別。

通用的 AI 生成設計往往看起來一樣。此技能引導打造令人難忘、具備量產等級的前端介面，採用大膽的美學選擇與卓越的視覺精緻度。

建置無障礙 React 元件需要時間和對鍵盤導航及 ARIA 屬性的仔細關注。此技能提供可複製貼上的 shadcn/ui 元件模式，包含表單驗證、暗色模式和響應式佈局，適用於 Next.js 應用程式。

設計視覺一致的作品既耗時又需要設計專業知識。此技能提供 10 種專業策劃的主題,包含色彩配色方案和字體配對,可立即應用於簡報、文件和報告。

為 Slack 建立動畫 GIF 需要遵守嚴格的檔案大小限制並使用適當的動畫技術。本工具包提供驗證器、動畫基本元素和優化工具，用於建立訊息 GIF 和自訂表情符號，確保在 Slack 中完美運作。

使用者難以將抽象的設計概念轉化為引人注目的視覺藝術作品。此技能使用哲學框架生成博物館級品質的視覺設計，以 PNG 和 PDF 格式創作具有專業排版的原創作品。

建立符合 Anthropic 視覺識別的文件和成品。在所有素材中一致地應用官方品牌色彩和排版。

創作生成藝術需要技術能力和藝術視野的結合。此技能引導 AI 系統創作具有可控隨機性、互動參數和藝廊品質輸出的原創演算法藝術。

在沒有標準化設計基礎的情況下，跨應用程式建立一致、可訪問的用戶界面是一項挑戰。本技能提供設計 Token 結構、元件模式和可訪問性指南，幫助構建可擴展的設計系統，確保視覺一致性和 WCAG 合規性。

根據 Vercel 的官方無障礙設計指南檢查您的網頁 UI。獲得關於語義 HTML、焦點狀態、表單、動畫、排版、圖片等的即時回饋。

許多 AI 生成的介面看起來千篇一律，缺乏創意特色。本技能引導 Claude Code 建立具有卓越美學品質、獨特視覺識別度以及周全設計決策的生產級 Web 介面，避免常見的 AI 模式。

在文件中保持一致的品牌識別既耗時又容易出錯。此技能提供即時存取企業品牌標準,包括色彩調色板、排版、格式規則和驗證工具,以確保所有文件符合專業品牌指南。