デジタル庁デザインシステム のコンポーネントの一部をReact / Tailwind CSSベースで実装したサンプル集です。
Storybookで最新版を公開しています。
このリポジトリでは全てのコンポーネントは実装していません。
（定期的にサンプルは追加予定です。）
未実装のコンポーネントについてはスクラッチで書かずに、以下のようなヘッドレスUIライブラリの利用を推奨します。
スクラッチで書く場合は、ARIA Authoring Practices Guide (APG)のPatternsを参考にして実装を進める事を推奨します。
以下のコマンドでStorybookを実行してください。
npm install
npm run storybook@digital-go-jp/tailwind-theme-plugin は、デジタル庁デザインシステムのデザイントークンをベースにしたTailwind CSSのプラグインです。
プラグインで定義されるトークン一覧は、トークン一覧 をご確認ください。
プロジェクト固有のトークン等については tailwind.config.js の extend で拡張してください。
- サンプルコードは Google Chrome / Microsoft Edge / Safari / Firefox の最新版で動作を確認しています。
- サンプルコードはプロジェクトの特性に合わせて自由に拡張してください。
ご興味を持って頂きありがとうございます。
リリース直後のため、現在体制がまだ整っておりません。
そのため、何かお気づきの点やご要望がございましたら、まずはIssueの作成をお願いします。PRはそのIssueでの議論が終わった後に作成してください。
また、現時点ではコンポーネントそのものに関するIssueのみを受け付けておりますので、予めご了承ください。