RGBをHEXに変換
RGB値をHEXカラーコードに変換し、計算の過程も表示します。各チャンネルを16で割った商と余り、#RRGGBBAAのアルファ付きコード、3桁の短縮形まで一度に確認できます。
逆方向の変換ですか? HEXをRGBに変換 →
RGBは画面の色を、赤・緑・青の強さ(0〜255)で表します。HEXは同じ3つの数を16進数で2桁ずつ書いたもので、255はFFになり、色は #1E90FF のような短いコードになります。この変換ツールはコードに加えて計算の過程も示すので、宿題や試験、手計算の確認に便利です。
使い方
- 赤・緑・青を0〜255で入力します。
- 必要なら不透明度を100%未満にして、8桁の #RRGGBBAA コードを得ます。
- HEXコード、(あれば)3桁の短縮形、手順の表を確認します。
- 複数の色は、一括入力欄に1行に1組のRGB値を貼り付けます。
計算式
各チャンネルについて、商 = ⌊値 ÷ 16⌋、余り = 値 mod 16 で、HEXの2桁は商に対応する数字、続けて余りに対応する数字です(10 = A、11 = B、12 = C、13 = D、14 = E、15 = F)。
不透明度は4つ目の2桁になり、round(不透明度 × 255) です。3桁の短縮形 #RGB があるのは、すべての2桁が同じ数字の繰り返しのときだけです(例:#FF8800 = #F80)。
計算例
rgb(30, 144, 255):30 ÷ 16 = 1 余り 14 → 1E、144 ÷ 16 = 9 余り 0 → 90、255 ÷ 16 = 15 余り 15 → FF。まとめると #1E90FF(ドジャーブルー)です。不透明度50%なら 0.5 × 255 = 127.5 が128に丸められて80になり、#1E90FF80 となります。
よくある質問
電卓なしで手計算するにはどうしますか?
16で割ります。商が1桁目、余りが2桁目です。200なら 200 ÷ 16 = 12 余り 8 → C8 です。
同じ色なのに、デザインツールで違うHEXが表示されるのはなぜですか?
多くの場合、ツールが別のカラープロファイル(Display P3やAdobe RGB)で作業して変換しているためです。CSSのHEXは常にsRGBを意味します。
どんな色でも3桁に短縮できますか?
いいえ。各2桁が同じ数字(00、11 … FF)になっている4,096色だけに短縮形があります。
最終更新:
この入力内容のページアドレス: https://kakao.mobile/ja/tools/how-rgb-to-hex-converter/
このツールを引用する
kakaoCalc. (2026, November 8). RGBをHEXに変換. https://kakao.mobile/ja/tools/how-rgb-to-hex-converter/
“RGBをHEXに変換.” kakaoCalc, 8 Nov. 2026, kakao.mobile/ja/tools/how-rgb-to-hex-converter/.