ui-styling
使用 shadcn/ui 與 Tailwind CSS 建構可存取且一致的使用者介面。採用組件優先架構以建立設計系統、整合 React Hook Form,並實踐響應式行動優先開發。
探索可重用的代理技能,查看實作細節,快速找到適合你工作流程的技能。
共找到 84 個技能
使用 shadcn/ui 與 Tailwind CSS 建構可存取且一致的使用者介面。採用組件優先架構以建立設計系統、整合 React Hook Form,並實踐響應式行動優先開發。
實作 shadcn/ui 元件:包含安裝、Vite/TanStack Router 設定、CLI 指令管理及 Tailwind CSS 整合。
根據 components.build 規範構建現代化、可組合且易於存取的 React UI 元件。適用於設計系統、元件庫及可重用 UI 架構的開發與維護。
產生 UI 元件、Hero 區塊與回饋表單。整合無障礙檢查清單與專業設計參考,確保開發品質。
使用 Pencil MCP 進行工業級 UI 設計的完整工作流程與組件庫,包含顏色、字體、間距與陰影的標準化設計規範。
使用 Design Graph 方法論構建連貫且基於約束的設計系統。自動化設計令牌、排版比例、元件、變體及主題的創建過程。
分析 Stitch 專案並將語義化設計系統合成為 DESIGN.md 檔案,作為 AI 驅動 UI 生成的真實數據來源。
UI/UX 設計助手,為 React/Next.js 專案強制執行組件庫使用規範、可訪問性與設計標記。確保使用 shadcn/ui、Aceternity 等核准庫來保持視覺一致性。
專業 UI 設計系統工具包,涵蓋設計代幣生成、組件架構、響應式設計計算及開發人員交接文檔,確保視覺一致性。
Next.js React Server Components (RSC) 指南,涵蓋伺服器與客戶端組件邊界、數據獲取及組合模式。
Nuxt UI v4 生產環境組件庫,包含 125+ 個可存取組件、Tailwind CSS v4、Reka UI,以及專為儀表板、AI 對話和編輯器設計的專業版面。
使用 React、Next.js 與 shadcn/ui 等現代設計系統,建構專業、易於使用且具響應式的介面。專注於開發者工具、聊天介面及即時串流組件。