色見本(基本)

基本色 (明度変化)


    ※ 体裁が崩れる場合は、文字サイズを小さく表示してください。


                       

  ■  #fff0f0
  ■  #ffe0e0
  ■  #ffd0d0
  ■  #ffc0c0
  ■  #ffb0b0
  ■  #ffa0a0
  ■  #ff9090
  ■  #ff8080
  ■  #ff7070
  ■  #ff6060
  ■  #ff5050
  ■  #ff4040
  ■  #ff3030
  ■  #ff2020
  ■  #ff1010
  ■  #ff0000
  ■  #ee0000
  ■  #dd0000
  ■  #cc0000
  ■  #bb0000
  ■  #aa0000
  ■  #990000
  ■  #880000
  ■  #770000
  ■  #660000
  ■  #550000
  ■  #440000
  ■  #330000
  ■  #220000
  ■  #110000

  ■  #fffff0
  ■  #ffffe0
  ■  #ffffd0
  ■  #ffffc0
  ■  #ffffb0
  ■  #ffffa0
  ■  #ffff90
  ■  #ffff80
  ■  #ffff70
  ■  #ffff60
  ■  #ffff50
  ■  #ffff40
  ■  #ffff30
  ■  #ffff20
  ■  #ffff10
  ■  #ffff00
  ■  #eeee00
  ■  #dddd00
  ■  #cccc00
  ■  #bbbb00
  ■  #aaaa00
  ■  #999900
  ■  #888800
  ■  #777700
  ■  #666600
  ■  #555500
  ■  #444400
  ■  #333300
  ■  #222200
  ■  #111100

  ■  #f0fff0
  ■  #e0ffe0
  ■  #d0ffd0
  ■  #c0ffc0
  ■  #b0ffb0
  ■  #a0ffa0
  ■  #90ff90
  ■  #80ff80
  ■  #70ff70
  ■  #60ff60
  ■  #50ff50
  ■  #40ff40
  ■  #30ff30
  ■  #20ff20
  ■  #10ff10
  ■  #00ff00
  ■  #00ee00
  ■  #00dd00
  ■  #00cc00
  ■  #00bb00
  ■  #00aa00
  ■  #009900
  ■  #008800
  ■  #007700
  ■  #006600
  ■  #005500
  ■  #004400
  ■  #003300
  ■  #002200
  ■  #001100

  ■  #f0ffff
  ■  #e0ffff
  ■  #d0ffff
  ■  #c0ffff
  ■  #b0ffff
  ■  #a0ffff
  ■  #90ffff
  ■  #80ffff
  ■  #70ffff
  ■  #60ffff
  ■  #50ffff
  ■  #40ffff
  ■  #30ffff
  ■  #20ffff
  ■  #10ffff
  ■  #00ffff
  ■  #00eeee
  ■  #00dddd
  ■  #00cccc
  ■  #00bbbb
  ■  #00aaaa
  ■  #009999
  ■  #008888
  ■  #007777
  ■  #006666
  ■  #005555
  ■  #004444
  ■  #003333
  ■  #002222
  ■  #001111

  ■  #f0f0ff
  ■  #e0e0ff
  ■  #d0d0ff
  ■  #c0c0ff
  ■  #b0b0ff
  ■  #a0a0ff
  ■  #9090ff
  ■  #8080ff
  ■  #7070ff
  ■  #6060ff
  ■  #5050ff
  ■  #4040ff
  ■  #3030ff
  ■  #2020ff
  ■  #1010ff
  ■  #0000ff
  ■  #0000ee
  ■  #0000dd
  ■  #0000cc
  ■  #0000bb
  ■  #0000aa
  ■  #000099
  ■  #000088
  ■  #000077
  ■  #000066
  ■  #000055
  ■  #000044
  ■  #000033
  ■  #000022
  ■  #000011

  ■  #fff0ff
  ■  #ffe0ff
  ■  #ffd0ff
  ■  #ffc0ff
  ■  #ffb0ff
  ■  #ffa0ff
  ■  #ff9fff
  ■  #ff80ff
  ■  #ff70ff
  ■  #ff60ff
  ■  #ff50ff
  ■  #ff40ff
  ■  #ff30ff
  ■  #ff20ff
  ■  #ff10ff
  ■  #ff00ff
  ■  #ee00ee
  ■  #dd00dd
  ■  #cc00cc
  ■  #bb00bb
  ■  #aa00aa
  ■  #990099
  ■  #880088
  ■  #770077
  ■  #660066
  ■  #550055
  ■  #440044
  ■  #330033
  ■  #220022
  ■  #110011
   

 

利用例

 この表の、一番上の行を見る。すると、
  最も左の赤 ……   ■  #fff0f0
  その隣の黄 ……   ■  #fffff0

 そこで、両者の中間的な色を得たければ、両者の中央の値を取る。 #ffe0e0  と  #ffffe0 の中央の値として、 #fff8f0 を取る。すると、次の例となる。
    ■  #fff8f0

 

注記

 数字はすべて 16 進数である。(10進数ではない。)
 1 〜 9 までは、その値のまま。
 a 〜 f は、10,11,12,13,14,15 に相当する。
 (トランプに似ている。トランプでは、J,Q,K が 11,12,13 に相当する。)

 

3桁数字

 以上では、6桁の数字を使った。ただし ( HTML はともかく)CSS では、3桁の数字が使われることもある。
 換算するには、次のようにするといい。つまり、同じ数字を二度繰り返す。
  3桁の 000 → 6桁の 000000
  3桁の 789 → 6桁の 778899
  3桁の ff0  → 6桁の ffff00

中間色


 上記以外の中間色については、次のサイトをご利用下さい。

   → 色見本 (コードつき)

  ※ 「色見本」という語でネットを検索すると、他のサイトも見つかります。