カラーコンバーター
HEX、RGB、HSL、HWB、CMYKの色をライブプレビューと透明度対応で相互変換。
選択
アルファ（透明度）
1.00
HEX
コピーしました！
RGB
コピーしました！
HSL
コピーしました！
HWB
コピーしました！
OKLCH
コピーしました！
CMYK（近似値）
コピーしました！
最も近いCSS色名
—
相対輝度 (WCAG)
—
カラーハーモニー（クリックして使用）
使い方
カラーコンバーターは、HEX・RGB・HSL・HSB/HSVフォーマット間で瞬時に色を変換します。
使い方：
- 任意のフィールド（HEX、RGB、HSL、HSB）に色の値を入力します。
- 他のフォーマットが自動的に更新されます。
- ビジュアルピッカーを使用してグラフィカルに色を選択できます。
- 必要なフォーマットをコピーします。
例：#3498db → RGB(52, 152, 219) → HSL(204°, 70%, 53%)。
制限事項：色空間間の変換では、丸め処理により若干の差異が生じる場合があります。このツールは標準sRGB空間の色をカバーしています。
プライバシー：すべてローカルで計算され、何も送信されません。
実践例
#1E90FF を入力すると:rgb(30, 144, 255) と hsl(210, 100%, 56%) が表示され、名前付き CSS カラー dodgerblue と特定され、WCAG 相対輝度も示されます。配色セクションは補色・類似色・トライアド・分裂補色のパートナーを生成 — どのスウォッチもクリックで読み込んで探索を続けられます。逆方向も同じくらい日常的です:デザインツールから rgb(30, 144, 255) を貼り付け、スタイルシート用に hex をコピー。値を調整する間、すべての形式が同期し続けます。
活用シーン
- ツール間のデザインカラー照合
- ブランドカラーパレットの変換
- CSSカラーバリアントの作成
- カラーモデルの理解
- 異なる環境向けのカラー値のエクスポート
よくある質問
- HSLとHSBの違いは何ですか？
- HSL（色相・彩度・輝度）とHSB/HSV（色相・彩度・明度）は輝度成分の定義が異なります。
- なぜ変換後の値が若干異なるのですか？
- 数学的な変換における丸め処理のためです。
- CSS名前付き色は入力できますか？
- いいえ、同等の16進数コードを使用してください。
- RGBAフォーマットはサポートされていますか？
- このツールはアルファチャンネルなしのHEX・RGB・HSL・HSBをカバーしています。
- 値をコピーするには？
- 希望の結果フィールドをクリックして選択し、コピーします。