CSSカラーパレットジェネレーター について
任意のベースカラーから調和のとれたカラーパレットを生成します。CSS変数、SCSS変数、またはTailwind設定としてエクスポートでき、すべてブラウザ内で動作します。
CSSカラーパレットジェネレーター の使い方
- 1カラーピッカーでベースカラーを選ぶか、HEX値を入力します。
- 2調和タイプを選択します：補色、類似色、三色、分裂補色、四色、またはモノクロマティック。
- 3各色のHEX、RGB、HSL値で生成されたパレットを確認します。
- 4任意のカラースウォッチをクリックして値をコピーします。
- 5パレット全体をCSS変数、SCSS変数、またはTailwind設定としてエクスポートします。
ヒント
- モノクロマティックパレットは初心者に最も安全です。常にまとまりがあり、プロフェッショナルに見えます。
- 三色パレットは鮮やかですが、慎重なバランスが必要です。1色をドミナントに、残りをアクセントに使用してください。
- Tailwind設定としてエクスポートすると、パレットをtailwind.config.jsに直接投入できます。
OneKitTools チーム更新日 2.21.4