Claude Code Skillsでデザインシステム自動生成

**投稿者:** 藤田拳｜株式会社ピネアルCTO (@kenfjt)

**投稿日時:** 2026年2月3日 (火) 09:26 JST

**URL:** https://x.com/kenfjt/status/2018617021412659691

**エンゲージメント:** 7返信 / 107リポスト / 1,480いいね / 2,004ブックマーク / 167,619表示

**カテゴリ:** 💻 技術Tips

**有益度:** ⭐⭐⭐ HIGH

---

概要

AIでデザインシステムが作れた！！

やり方：

デザインシステムを作る元となる素材を入れる（今回であれば pineal.co.jp のウェブサイト）

↓

Claude CodeでSkillsをダウンロード

↓

「この素材でデザインシステムを作って」と指示

↓

完成

---

まとめ

Tom Dörrが公開したデザインシステム生成Skillsを使用。既存のウェブサイトを素材として入力するだけで、Claude Codeが自動的にデザインシステムを生成してくれる。プロジェクト要件からデザインシステムを生成する能力を持つ。

---

引用ツイート

Tom Dörr (@tom_doerr):

Generates design systems from project requirements

https://github.com/tom_doerr/design-system-generator

---

関連リンク

• [元ツイート](https://x.com/kenfjt/status/2018617021412659691)
• [ピネアル株式会社](https://pineal.co.jp)