安裝
npx skills add arvindrk/extract-design-system適合誰
需要從公開網站反推設計權杖，並給本機專案產生起始 JSON 和 CSS 自訂屬性時，再裝這條 Skill。官方涵蓋 colors、typography、spacing、border radius、shadows，並可作為 AI agent skill（Claude、Cursor、Codex）或 standalone CLI 使用。
適合要快速拿到 starter tokens、而不是一整套元件庫的人。正文列出這三個代理，同時也寫了獨立 CLI，不要理解成只支援其中某一個。若目標站點不能公開存取，或你指望它改框架設定、自動改應用，這條技能對不上。
頁面： https://github.com/arvindrk/extract-design-system
3 分鐘完成第一次嘗試
只走這一條安裝命令：
npx skills add arvindrk/extract-design-system
前置條件：你有一個本機專案，並且準備從「可公開存取的單頁」抽權杖；你接受它會寫入官方列出的檔案。不要指定未出現的目錄。
第一次先核對範圍，不要立刻寫檔案。向代理確認：能抽哪些權杖、會產生哪些檔案、哪些事它不會做。成功訊號是代理說出 colors / typography / spacing / border radius / shadows，並列出 .extract-design-system/raw.json、.extract-design-system/normalized.json、design-system/tokens.json、design-system/tokens.css；同時複述 Public websites only、Single-page extraction workflow、Starter tokens, not a full component library、No framework config patching or automatic app rewrites。
確認後，再用官方示例請它擷取： https://stripe.com 並 generate starter token files for this project。成功訊號是上述四個檔案出現，且框架設定未被改動。頁面寫了 standalone CLI，但沒有給出啟動命令，不要編造。
使用案例
案例一：按官方示例抽 Stripe。原文是 Extract the design system from https://stripe.com and generate starter token files for this project。這是寫檔案和存取外網，執行前先確認專案目錄無誤。能核對的是得到起始權杖檔，而不是一套元件。
案例二：換另一個公開單頁，仍只產起始權杖。把任意可公開打開的一頁交給代理，要求只抽權杖、不改應用。成功訊號仍是那四份官方檔案，並且代理拒絕補框架修補。多頁站點不要假設它會爬完全站，正文寫明 single-page。
使用邊界
只接受公開網站。非公開、需登入的頁面不在範圍內。
一次只抽一頁。產物是 starter tokens，不是完整元件庫。
不會做 framework config patching，也不會 automatic app rewrites。
輸出路徑以正文為準，不要改名或另存到未寫出的位置。
Claude、Cursor、Codex 與 standalone CLI 都寫在原文裡，不要寫成獨家支援。CLI 啟動方式未給出，不要發明。未寫出的選擇器、登入態和批量網域都不要補。