extract-design-system
extract-design-systemは任意のWebサイトからデザインプリミティブを抽出し、デザイントークンを生成できるようにするCLI付きエージェントスキルです。Claudeで使えるデザインルール抽出エージェント、という感じでしょうか。
エージェントスキルというのはClaudeの拡張モジュールで、extract-design-systemもその一つとしてOSSとして公開されています。
タイトルの通りで、任意のWebサイトのデザインをリユーザブル（再利用可能）にするため、デザインプリミティブ、つまり構成される基本要素、色や余白、間隔、タイポグラフィなどを抽出、分析し、デザイントークン（JSON + CSS）を生成できる、というものになります。
主なユースケースとして、ルールを文書化しなかった過去のデザインをそのまま使いつつ、Webサイトの拡張に用いる事が出来るようトークンを生成する、あるいはスタイルは概ねそのままにしつつテクノロジーをモダン化する、参考サイトを手作業で真似るのではなくAIで解析してトークンを生成してカスタマイズする、といった際に貢献してくれそうです。
ClaudeをAIエージェントに使用しているデザイナーや開発者の方はご利用になってみては如何でしょうか。ライセンスはMIT。
