本文へ移動

カラーパレット生成

3〜8色を生成し、好きな色の固定・HEX編集・パレット出力ができます。

パレット設定

ブラウザー内で処理します。

結果

値を入力して計算してください。

使い方

ページを開くとパレットが表示され、色の入力は必要ありません。3〜8色と色の関係を選び、生成ボタンで別の組み合わせを試せます。好きな色を固定すると、次の生成では残りだけが変わります。同じボタンでもう一度押すと固定を解除します。

計算方法と結果の読み方

HSLで類似色は25°、補色は180°、三色配色は120°の色相差を使い、同系色では色相を共有します。明度は30〜75%、彩度は60〜80%です。固定色がある場合は最初の固定位置を色相の基準にし、他の固定色はそのまま保ちます。

計算例

3色の組み合わせなら色数3を選んで生成し、好きなカードを固定します。再生成で残り2色を変更できます。任意の調整にはHEX欄の前にある色見本を押すか、後ろのHEX文字を編集します。編集した色は自動固定され、見た目と出力が同時に更新されます。

制限とエラー

HEX一覧または--color-1、--color-2などのCSSをコピーできます。形式を変えても色は維持します。SVG・PNGは同じ順序とHEXラベルの帯画像です。HEXが未完成なら編集欄を残したままコピーと保存を無効にし、修正後に再開します。クリアはパレットと固定を消し、生成で入力なしに作り直せます。

よくある質問

調和のとれた配色を保証しますか。

いいえ。色の関係は出発点であり、好みやパーソナルカラーの診断ではありません。ラベルには読みやすい黒か白を使いますが、実際のデザインで文字と背景の組み合わせを確認してください。不透明な6桁sRGB HEXだけに対応し、写真分析やグラデーションは扱いません。