CSS変数ジェネレーター
カラートークンを作成し、変数を確認して、使えるCSSカスタムプロパティをコピーできます。
使い方
- brand、theme、ui などの接頭語を入力します。
- 各変数名と色を編集します。
- 必要に応じて行を追加します。
- 生成されたCSSをコピーしてスタイルシートに貼り付けます。
カラープレビュー
--brand-primary
--brand-secondary
--brand-accent
生成されたCSS変数
:root {
--brand-primary: #4f46e5;
--brand-secondary: #06b6d4;
--brand-accent: #f59e0b;
}