HEX→HSL変換ツール — 色コードとコントラスト
3桁または6桁のsRGB 16進カラーコードをHSLとRGBの値に変換します。
計算式と出典の更新 · 出典 · 1アルゴリズム・定数・初期入力を確認（JSON）
この計算機について
#3B82F6のような3桁または6桁のsRGB 16進カラーを入力してください。透明度付きの形式には対応していません。RGBとHSLの不透明色を出力します。
計算例
下記の既定値を用いた計算結果
HEXカラー #3B82F6 HSL hsl(217, 91%, 60%) · HSL hsl(217, 91%, 60%) · 色相 217 ° · 彩度 91.2 % · 明度 59.8 % · RGB 59, 130, 246
算出方法と前提
L = (M + m) ÷ 2; S = Δ ÷ (1 − |2L − 1|); H → 60° × ((G−B)/Δ mod 6 (R = M) | (B−R)/Δ + 2 (G = M) | (R−G)/Δ + 4 (B = M)) R,G,Bは0〜1。Δ = 0 のとき H = S = 0。SとLはパーセントで表示。 #3B82F6のような3桁または6桁のsRGB 16進カラーを入力してください。透明度付きの形式には対応していません。RGBとHSLの不透明色を出力します。 参考資料は定義や方法を説明します。追加の既定値については、このページの仮定を確認してください。
出典
参考資料は定義や方法を説明します。追加の既定値については、このページの仮定を確認してください。
免責事項
本計算ツールは一般的な換算結果を提供します。丸め処理と入力値の精度の両方が出力に影響するため、表示される小数は概数として扱ってください。
実装の出典
この記録は本ページの実装を示し、独立した検証を意味しません。外部資料は明示された式や定義のみを裏付けます。推定や独自ルールにはそれぞれの前提があります。
式と変数
L = (M + m) ÷ 2; S = Δ ÷ (1 − |2L − 1|); H → 60° × ((G−B)/Δ mod 6 (R = M) | (B−R)/Δ + 2 (G = M) | (R−G)/Δ + 4 (B = M))
- R,G,B
- 正規化した色成分（0–1）
- M
- max(R, G, B)
- m
- min(R, G, B)
- Δ
- M − m
- H,S,L
- 色相°、彩度、明度
R,G,Bは0〜1。Δ = 0 のとき H = S = 0。SとLはパーセントで表示。
よくある質問
対応しているHEX形式は？
#3B82F6のような3桁または6桁のsRGB 16進カラーを入力してください。透明度付きの形式には対応していません。RGBとHSLの不透明色を出力します。
HEX→HSL変換ツール — 色コードとコントラストの入力と範囲は？
各欄の単位に合わせて入力してください。表示範囲はフォームの制限であり、推奨値ではありません。 L = (M + m) ÷ 2; S = Δ ÷ (1 − |2L − 1|); H → 60° × ((G−B)/Δ mod 6 (R = M) | (B−R)/Δ + 2 (G = M) | (R−G)/Δ + 4 (B = M)) R,G,Bは0〜1。Δ = 0 のとき H = S = 0。SとLはパーセントで表示。 #3B82F6のような3桁または6桁のsRGB 16進カラーを入力してください。透明度付きの形式には対応していません。RGBとHSLの不透明色を出力します。 参考資料は定義や方法を説明します。追加の既定値については、このページの仮定を確認してください。
HEXカラー = #3B82F6の計算例は？
入力: HEXカラー = #3B82F6. 計算: L = (M + m) ÷ 2; S = Δ ÷ (1 − |2L − 1|); H → 60° × ((G−B)/Δ mod 6 (R = M) | (B−R)/Δ + 2 (G = M) | (R−G)/Δ + 4 (B = M)). 結果: HSL = hsl(217, 91%, 60%); 色相 = 217 °; 彩度 = 91.2 %; 明度 = 59.8 %; RGB = 59, 130, 246.