
效果預覽
相似的 Skills
查看所有 Skills你將獲得
- 頻譜監測圖表 的完整原始碼——元件檔案加上可執行的使用範例,貼上就能編輯。
- 一份書面視覺規範:配色、字級、圓角、圖示線寬與動態時序,全部以 token 集中在一處編輯。
- 響應式斷點已調校完成,從桌機一路到手機都適用。
適合
- 你需要在頁面上放資料視覺化,又不想自己串接圖表函式庫。
- 你希望圖表的配色與間距和頁面其他部分一致。
- 你想要可讀、可編輯的原始碼,而不是又一個得持續升級的相依套件。
不適合
- 已在使用成熟設計系統的團隊——這套配色與字級會和你們的互相衝突。
- 想要有版本號 npm 套件的人;這裡交給你的是需要自行維護的原始碼。
- 需要導覽列、表單、登入驗證或結帳流程的專案——這個區塊都不涵蓋。
客戶交付與高層簡報學術研究與技術溝通網頁設計與數位體驗製作資訊圖表製作 UI 視覺建置網頁成果可編輯視覺精美新手友善暖中性色青綠點綴編輯風
關於此 Skill

貼上一個區塊,頁面上就會出現一張真正的資料視覺化圖表,是正式繪製而成,而不是用 SVG 隨手拼湊。填入你的數字,圖形就會自動重繪。
你會得到
- 頻譜監測圖表 的完整原始碼——元件檔案加上可執行的使用範例,貼上就能編輯。
- 一份書面視覺規範:色盤、字級、圓角、圖示線寬與動態時間,全部以 token 形式集中在一處編輯。
- 已調校好的響應式斷點,從桌機一路到手機。
使用方式
- 告訴你的助理這個區塊要放在哪裡,它會先讀取你的專案,再依照專案既有的寫法產出區塊。
- 把文字換成你的內容,字級與間距會自動維持。
- 只要在一處修改強調色,整個區塊就會跟著變。
- 上線前先用手機檢查一下,它已經針對手機做好調整。
開始前需要準備什麼
- 最近實測
- v1.0.0 — Claude Code / Claude Desktop / Cowork / Codex / ChatGPT
使用者評價
正在載入評價…








