カラーコード変換
HEX、RGB、HSLのカラー表記を相互に変換します。
RGBrgb(59, 130, 246)
HSLhsl(217, 91%, 60%)
使用例
デザインカンプの色コードを変換する
デザインツールから取得したHEXコードを、CSSにそのまま使えるRGBやHSLの値に変換できます。
RGB値からHEXコードを作る
画像編集ソフトで確認したRGBの数値を入力して、コードで使うHEXカラーコードをすぐに取得できます。
HSLで明度・彩度の調整感覚をつかむ
同じ色をHSLに変換して、色相(H)を保ったまま彩度や明度をどう変えればよいかの参考にできます。
よくある質問
入力した色の値はサーバーに送信されますか?
いいえ。すべての変換はブラウザ内でのみ行われ、入力した色の値がサーバーに送信されることはありません。
3桁の省略形HEXコードにも対応していますか?
はい。#FFFのような3桁の省略形も認識し、6桁に展開してから変換します。
RGBやHSLを入力するときの形式は?
数値をカンマまたは空白で区切って入力してください。例えばRGBなら「59, 130, 246」、HSLなら「217, 91, 60」のように入力します。
カラーピッカーで選んだ色もすぐ反映されますか?
はい。カラーピッカーで選んだ色は、HEX/RGB/HSLの値に即座に反映されます。