カラーコード変換

同じWebカラーを表す3つの形式

HEXとRGBは赤・緑・青の光を符号化します。#3366FFは51、102、255で、#0F8は#00FF88に展開されます。HEX出力は常に大文字6桁です。

HSLは色相・彩度・明度で表します。色相は色相環、彩度は無彩色から鮮やかさ、明度は黒から白への位置です。関連色の調整に便利です。

変換方向と計算

HEXからRGBは16進数2桁ずつを0〜255へ変え、RGBからHEXは逆に変換します。RGBからHSLはチャンネルを正規化し最大値・最小値から明度、彩度、色相を求めます。HSLからRGBはクロマ、色相区分、明度の補正を使います。

HEX→RGB、RGB→HEX、HEX→HSL、HSL→HEX、RGB→HSL、HSL→RGBの6方向に対応します。HEXとHSLの間は等価なRGBを内部で経由します。

範囲・色相の周期・精度

• HEXは#任意の3桁または6桁のみです。アルファ、色名、任意のCSS式は対象外です。
• RGBは0〜255の整数です。無効値を自動で切り詰めません。
• 彩度と明度は0〜100%。色相は周期的で、420°は60°、−120°は240°と同じです。
• RGBとHEXは整数、HSLは最大2桁の小数です。彩度0%の黒・白・灰色は色相0°で表示します。
• 色見本は画面校正、印刷プロファイル、コントラスト検査の代わりではありません。

用途と出力

• HEXのデザイントークンをコードや資料向けのRGBに変換します。
• ホバー、枠線、背景などの関連色を調整する前にRGBをHSLへ変換します。
• 色見本を確認してCSS値をコピーできます。入力色は解析へ送信されません。
• パレット作成、画像からの抽出、CMYK印刷プロファイルは提供しません。

HEX・RGB・HSLの変換方向

手元のコードと必要なコードに合う組み合わせを選びます。各方向で形式の正式名、計算方法、入力から結果までの例を示します。