Tailwind Theme Plugin
@digital-go-jp/design-tokens をベースにした Tailwind CSS のテーマプラグイン。
インストール
npm install @digital-go-jp/tailwind-theme-plugin
プラグイン設定方法
Tailwind CSS v3
tailwind.config.js の plugins 部分を以下のように設定してください。
{
content: [...],
theme: {
extend: {
...
},
},
plugins: [require('@digital-go-jp/tailwind-theme-plugin')],
}
Tailwind CSS v4
Tailwind CSS の設定をしている CSS ファイルで以下のように設定してください。
@import 'tailwindcss';
@import '@digital-go-jp/tailwind-theme-plugin/v4';
使用例
- examples ディレクトリ
- React サンプルコンポーネント集
バージョン対応表
| Figma のバージョン | パッケージのバージョン |
|---|---|
| 2.3.0〜2.14.0 | 1.0.1 |
| 2.2.0 | 0.2.5 |
| 2.1.3 | 0.2.5 |
| 2.1.2 | 0.2.5 |
| 2.1.1 | 0.2.5 |
| 2.1.0 | 0.2.5 |
| 2.0.4 | 0.2.5 |
| 2.0.3 | 0.2.0 |
| 2.0.2 | 0.1.17 |
| 2.0.1 | 0.1.16 |
| 1.4.3 | 0.1.16 |
