Communitygithub.com

chiroro-jr/pencil-design

使用 Pencil(.pen 檔案)設計 UI,並從中生成生產級程式碼。適用於處理 .pen 檔案、在 Pencil 中設計畫面或元件,或從 Pencil 設計產生程式碼的任務。

pencil-design 是什麼?

chiroro-jr/pencil-design 技能可讓 AI 代理程式直接使用 Pencil 設計工具建立 UI 設計(.pen 檔案),並自動生成可供生產環境使用的程式碼。此技能對於採用設計到程式碼(design-to-code)工作流程的開發者特別有用,能顯著減少在設計與開發階段之間的轉換時間。支援的平台包括 Pencil MCP 工具,以及任何可存取 .pen 檔案的環境。其運作方式是透過 MCP 工具與 Pencil 設計檔案互動,識別畫面與元件的設計元素,並根據這些視覺規格產生高品質的程式碼,確保最終產品與原始設計一致。

相容平台~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/chiroro-jr/pencil-design-skill/tree/main/skills/pencil-design

在你喜歡的 AI 中提問

開啟一個已預先載入此 Agent Skill 的新對話。

說明文件

pencil-design 是做什麼的?

使用 Pencil(.pen 檔案)設計 UI,並從中生成生產級程式碼。適用於處理 .pen 檔案、在 Pencil 中設計畫面或元件,或從 Pencil 設計產生程式碼的任務。當任務涉及 Pencil、.pen 檔案、設計到程式碼工作流程,或使用 Pencil MCP 工具進行 UI 設計時,此技能將自動觸發。

相關技能