RGB・HSL変換ツール｜カラーコードを相互変換
RGBとHSLのカラーコードを無料で相互変換。数値を入力すると変換結果とHEX値、色のプレビューがリアルタイムに更新されます。
RGB (0-255)
R:
G:
B:
HSL (0-360 / 0-100%)
H:
°
S:
%
L:
%
RGB
rgb(99, 102, 241)
HSL
hsl(239, 84%, 67%)
HEX
#6366F1
このツールの使い方・詳細
🛠 使い方
RGBまたはHSLの値を入力してください。数値を変更すると、もう一方の値もリアルタイムに連動して更新されます。「彩度を上げたい」「明度を下げたい」といった直感的な色調整に適しています。
💡 活用シーン・ユースケース
- 特定の色をベースに、明るさ（L）や鮮やかさ（S）だけを調整したバリエーション色を作りたい時に
- プログラムで動的に色を変化させる際の計算用パラメータ（HSL）を確認したい時に
- デザインのトーン＆マナーを一定に保つための色空間の変換に
RGBとHSLの違い
RGBは赤・緑・青を0〜255で表し、HSLは色相（0〜360度）、彩度、明度をパーセントで表します。同じ色でも、rgb(99, 102, 241)とhsl(239, 84%, 67%)のように異なる形式で指定できます。
色味を保ちながら明るさや鮮やかさを調整するときはHSLが便利です。変換後のRGB・HSL・HEXは、それぞれコピーボタンから取得できます。