色変換ツール

色変換ツールについて

この色変換ツールはブラウザ内で完結します。ビジュアルピッカーで選色、プリセットをクリック、または HEX・RGB・HSL のいずれかの入力欄に値を入力すると、すべての欄が即座に同期してプレビューが更新されます。アップロードは一切なく、すべての変換はローカルデバイスで行われます。

HEX・RGB・HSL とは

• HEX — RGB色の16進数表現で、#RRGGBB と表記します。2桁ごとに赤・緑・青のチャンネル（00–FF）を表します。最もコンパクトで、HTMLやCSSで最もよく使われる形式です。
• RGB — 3つの加色チャンネルを 0〜255 の10進数整数で列挙します（例：14, 165, 233）。デザインツールや、特定のチャンネルを読み取って操作したい場合に便利です。
• HSL — 色相（0〜360°、カラーホイール上の位置）、彩度（0〜100%、色の鮮やかさ）、輝度（0〜100%、明るさ）で色を表します。色相を選んでから鮮やかさと明るさを独立して調整できるため、人間にとって最も直感的な形式です。

どんな時にどの形式を使うか

• HTML/CSS、デザインの引き渡し、コンパクトな文字列が欲しい場面では HEX。
• rgba() の透過、チャンネル演算、0〜255の値を要求するグラフィックAPIでは RGB。
• 色のバリエーション（明色・暗色・カラーパレット）を生成する時は HSL。輝度や彩度の調整が容易だからです。

色変換ツールの使い方

1. カラースウォッチまたはビジュアルピッカーをクリックして、OS標準のカラーピッカーを開きます。
2. HEX・RGB・HSLのいずれかのテキスト欄を編集すると、他の欄が自動的に同期します。
3. プリセットチップをクリックしてよく使う色を読み込むか、ランダム色でランダムな色を生成します。
4. 各欄の横のコピーボタンを押すと、表示中の値がクリップボードにコピーされます。

よくある質問

この色変換ツールは無料ですか？ はい。完全無料で、ブラウザ内で動作します。登録も不要です。

色データはサーバーに送信されますか？ いいえ。すべての変換とコピーはローカルデバイスで行われます。

対応フォーマットは？ HEX（#RRGGBB および3桁の #RGB）、RGB（各チャンネル 0〜255）、HSL（色相 0〜360°、彩度・輝度 0〜100%）。

3つの形式すべてコピーできますか？ はい。各欄に独立した「コピー」ボタンがあり、表示中の値をそのままコピーします。

HSLの値が他のツールとわずかに違うのはなぜ？ 計算の異なる段階で丸めを行うため、最下位桁の ±1 の差は正常です。