このツールは …回 使われています。
コンピュータには便利でも、人にはちょっとピンとこない 16進数カラーコード。
このツールなら、RGBの数値とカラーコードをその場で相互変換でき、よく使う色はクリックひとつでコピーできます。
- カラーコードを今すぐ調べたい
- 色見本からコードをコピーしたい
RGB ⇔ カラーコード 相互変換ツール
R / G / B に 0〜255 の数値（半角）を入れると、カラーコードと色見本が表示されます。逆に、カラーコード（3桁または6桁）を入れると RGB の値が求められます。
16進数カラーコードって、なに？
HTMLやCSSで色を指定するときに使う、「#」＋6つの英数字で表すコードです（例：#FF0088）。中身はとてもシンプルで、RGBの数値を16進数に置き換えて並べているだけです。
変換のしくみ（例：R 255 / G 0 / B 136）
まずは光の三原色 R・G・B の数値からスタート。
それぞれを2桁の16進数へ変換。1桁になるときは頭に 0 を足して2桁にそろえます。
R → G → B の順につなげて、頭に「#」をつければ完成です。
そもそも何の数字？
画面の色は R(赤)・G(緑)・B(青) の光の組み合わせ。それぞれ 0〜255 の256段階で、合わせて約1,680万色を表現できます。
3桁に省略できることも
「FF0088」のように2桁が同じ文字でそろう色は、#F08 のように3桁でも書けます（例：#FFFFFF → #FFF）。
人は RGB の数値の方が色をイメージしやすく、機械はコードの方が扱いやすい。だから両方を行き来できると便利、というわけですね。RGB や CMYK の違いは こちらの記事 でくわしく解説しています。
代表的な色のカラーコード早見表（クリックでコピー）
よく使う代表色のカラーコードをまとめました。色をクリックまたはタップすると、その色のカラーコードをコピーできます。
色を視覚的に選びたい場合や、HSL・CMYK 形式・もっと多くの色から探したい場合は、216色をそろえたカラーピッカー付きの Web色見本帳 が便利です。
黒
000000
rgb(0, 0, 0)
888888
rgb(136, 136, 136)
222222
rgb(34, 34, 34)
aaaaaa
rgb(170, 170, 170)
444444
rgb(68, 68, 68)
cccccc
rgb(204, 204, 204)
666666
rgb(102, 102, 102)
eeeeee
rgb(238, 238, 238)
赤
ff0000
rgb(255, 0, 0)
ff4040
rgb(255, 64, 64)
ff8080
rgb(255, 128, 128)
ffbfbf
rgb(255, 191, 191)
オレンジ
ff8000
rgb(255, 128, 0)
ff9f40
rgb(255, 159, 64)
ffbf80
rgb(255, 191, 128)
ffdfbf
rgb(255, 223, 191)
黄
ffff00
rgb(255, 255, 0)
ffff40
rgb(255, 255, 64)
ffff80
rgb(255, 255, 128)
ffffbf
rgb(255, 255, 191)
黄緑
80ff00
rgb(128, 255, 0)
9fff40
rgb(159, 255, 64)
bfff80
rgb(191, 255, 128)
dfffbf
rgb(223, 255, 191)
緑
00ff00
rgb(0, 255, 0)
40ff40
rgb(64, 255, 64)
80ff80
rgb(128, 255, 128)
bfffbf
rgb(191, 255, 191)
青緑
00ff80
rgb(0, 255, 128)
40ff9f
rgb(64, 255, 159)
80ffbf
rgb(128, 255, 191)
bfffdf
rgb(191, 255, 223)
水色
00ffff
rgb(0, 255, 255)
40ffff
rgb(64, 255, 255)
80ffff
rgb(128, 255, 255)
bfffff
rgb(191, 255, 255)
緑青
0080ff
rgb(0, 128, 255)
409fff
rgb(64, 159, 255)
80bfff
rgb(128, 191, 255)
bfdfff
rgb(191, 223, 255)
青
0000ff
rgb(0, 0, 255)
4040ff
rgb(64, 64, 255)
8080ff
rgb(128, 128, 255)
bfbfff
rgb(191, 191, 255)
紫
8000ff
rgb(128, 0, 255)
9f40ff
rgb(159, 64, 255)
bf80ff
rgb(191, 128, 255)
dfbfff
rgb(223, 191, 255)
ピンク
ff00ff
rgb(255, 0, 255)
ff40ff
rgb(255, 64, 255)
ff80ff
rgb(255, 128, 255)
ffbfff
rgb(255, 191, 255)
ショッキングピンク
ff0080
rgb(255, 0, 128)
ff409f
rgb(255, 64, 159)
ff80bf
rgb(255, 128, 191)
ffbfdf
rgb(255, 191, 223)