HPB19 | HPB18 コンテンツ一覧
ホーム > HPB19 > HTML カラーパレット
目次 | 元のページ 前のページ | 次のページ サイトマップ | ページEND

HTML カラーパレット


HTML カラーパレットの指定



HTML構文内で、カラーパレットを直接指定することにより、ホームページビルダー等ホームページ作成ツールの基本機能では使用できない色、濃淡を表現することができます





ホームページビルダー 指定色 と CSS3 定義 基本色 (16色)



基本色 指定色 指定値 表示 HTML 記述
水色 aqua style="background-color : aqua;"
black style="background-color : black;"
blue style="background-color : blue;"
明るい紫 fuchsia style="background-color : fuchsia;"
gray style="background-color : gray;"
green style="background-color : green;"
黄緑 lime style="background-color : lime;"
maroon style="background-color : maroon;"
濃紺 navy style="background-color : navy;"
オリーブ olive style="background-color : olive;"
purple style="background-color : purple;"
red style="background-color : red;"
silver style="background-color : silver;"
青緑 teal style="background-color : teal;"
white style="background-color : white;"
黄色 yellow style="background-color : yellow;"
オレンジ orange style="background-color : orange;"
親要素の値を継承 inherit style="background-color : inherit;"
透明 transparent style="background-color : transparent;"



CSS3 定義 拡張色 (147色)



拡張色名 #rrggbb 拡張色名 #rrggbb
aliceblue #f0f8ff antiquewhite #faebd7
aqua #00ffff aquamarine #7fffd4
azure #f0ffff beige #f5f5dc
bisque #ffe4c4 black #000000
blanchedalmond #ffebcd blue #0000ff
blueviolet #8a2be2 brown #a52a2a
burlywood #deb887 cadetblue #5f9ea0
chartreuse #7fff00 chocolate #d2691e
coral #ff7f50 cornflowerblue #6495ed
cornsilk #fff8dc crimson #dc143c
cyan #00ffff darkblue #00008b
darkcyan #008b8b darkgoldenrod #b8860b
darkgray #a9a9a9 darkgreen #006400
darkgrey #a9a9a9 darkkhaki #bdb76b
darkmagenta #8b008b darkolivegreen #556b2f
darkorange #ff8c00 darkorchid #9932cc
darkred #8b0000 darksalmon #e9967a
darkseagreen #8fbc8f darkslateblue #483d8b
darkslategray #2f4f4f darkslategrey #2f4f4f
darkturquoise #00ced1 darkviolet #9400d3
deeppink #ff1493 deepskyblue #00bfff
dimgray #696969 dimgrey #696969
dodgerblue #1e90ff firebrick #b22222
floralwhite #fffaf0 forestgreen #228b22
fuchsia #ff00ff gainsboro #dcdcdc
ghostwhite #f8f8ff gold #ffd700
goldenrod #daa520 gray #808080
green #008000 greenyellow #adff2f
grey #808080 honeydew #f0fff0
hotpink #ff69b4 indianred #cd5c5c
indigo #4b0082 ivory #fffff0
khaki #f0e68c lavender #e6e6fa
lavenderblush #fff0f5 lawngreen #7cfc00
lemonchiffon #fffacd lightblue #add8e6
lightcoral #f08080 lightcyan #e0ffff
lightgoldenrodyellow #fafad2 lightgray #d3d3d3
lightgreen #90ee90 lightgrey #d3d3d3
lightpink #ffb6c1 lightsalmon #ffa07a
lightseagreen #20b2aa lightskyblue #87cefa
lightslategray #778899 lightslategrey #778899
lightsteelblue #b0c4de lightyellow #ffffe0
lime #00ff00 limegreen #32cd32
linen #faf0e6 magenta #ff00ff
maroon #800000 mediumaquamarine #66cdaa
mediumblue #0000cd mediumorchid #ba55d3
mediumpurple #9370db mediumseagreen #3cb371
mediumslateblue #7b68ee mediumspringgreen #00fa9a
mediumturquoise #48d1cc mediumvioletred #c71585
midnightblue #191970 mintcream #f5fffa
mistyrose #ffe4e1 moccasin #ffe4b5
navajowhite #ffdead navy #000080
oldlace #fdf5e6 olive #808000
olivedrab #6b8e23 orange #ffa500
orangered #ff4500 orchid #da70d6
palegoldenrod #eee8aa palegreen #98fb98
paleturquoise #afeeee palevioletred #db7093
papayawhip #ffefd5 peachpuff #ffdab9
peru #cd853f pink #ffc0cb
plum #dda0dd powderblue #b0e0e6
purple #800080 red #ff0000
rosybrown #bc8f8f royalblue #4169e1
saddlebrown #8b4513 salmon #fa8072
sandybrown #f4a460 seagreen #2e8b57
seashell #fff5ee sienna #a0522d
silver #c0c0c0 skyblue #87ceeb
slateblue #6a5acd slategray #708090
slategrey #708090 snow #fffafa
springgreen #00ff7f steelblue #4682b4
tan #d2b48c teal #008080
thistle #d8bfd8 tomato #ff6347
turquoise #40e0d0 violet #ee82ee
wheat #f5deb3 white #ffffff
whitesmoke #f5f5f5 yellow #ffff00
yellowgreen #9acd32



白黒濃淡表



指定値 表示 HTML 記述
000000 style="background-color : #000000;"
333333 style="background-color : #333333;"
666666 style="background-color : #666666;"
999999 style="background-color : #999999;"
cccccc style="background-color : #cccccc;"
ffffff style="background-color : #ffffff;"



Web セーフカラー (216色)



#00, #33, #66, #99, #cc, #ff を組み合わせてできる 216色は、256色モードのディスプレイでも、Windowsや Macintoshでも色の差異が少なく、Webで利用する上で安全な色、セーフカラーとされていますが、現在では、4096色以上の表示色、あるいは、フルカラーモードが一般的となっていますので、特別こだわる必要はありません


指定値
(先頭4桁)
指定値 (末尾2桁) 指定値
(先頭4桁)
00 33 66 99 cc ff
0000 0000
0033 0033
0066 0066
0099 0099
00cc 00cc
00ff 00ff
3300 3300
3333 3333
3366 3366
3399 3399
33cc 33cc
33ff 33ff
00 33 66 99 cc ff
6600 6600
6633 6633
6666 6666
6699 6699
66cc 66cc
66ff 66ff
9900 9900
9933 9933
9966 9966
9999 9999
99cc 99cc
99ff 99ff
00 33 66 99 cc ff
cc00 cc00
cc33 cc33
cc66 cc66
cc99 cc99
cccc cccc
ccff ccff
ff00 ff00
ff33 ff33
ff66 ff66
ff99 ff99
ffcc ffcc
ffff ffff
00 33 66 99 cc ff



カラーパレット



xx の値 ffffxx ffxxff ffxxxx xxffff xxffxx xxxxff xxxxxx xx の値
0f 0f
1f 1f
2f 2f
3f 3f
4f 4f
5f 5f
6f 6f
7f 7f
8f 8f
9f 9f
af af
bf bf
cf cf
df df
ef ef
ff ff
xx の値 ffffxx ffxxff ffxxxx xxffff xxffxx xxxxff xxxxxx xx の値


xx の値 fffffx fffxff fffxfx fxffff fxfffx fxfxff fxfxfx xx の値
f0 f0
f1 f1
f2 f2
f3 f3
f4 f4
f5 f5
f6 f6
f7 f7
f8 f8
f9 f9
fa fa
fb fb
fc fc
fd fd
fe fe
ff ff
xx の値 fffffx fffxff fffxfx fxffff fxfffx fxfxff fxfxfx xx の値



当サイト使用色



項目 表示 色指定 HTML 記述 使用箇所
赤 太字 赤字 #ff0000 <b><font color="#ff0000"> <h2>
青 太字 青字 #0000ff <b><font color="#0000ff"> <h3>
緑 太字 緑字 #009900 <b><font color="#009900"> 説明文
赤字 #ff0000 <font color="#ff0000">
青字 #0000ff <font color="#0000ff">
緑字 #009900 <font color="#009900">
薄黄 #ffffcc bgcolor="#ffffcc" パンくずリスト
薄々黄 #feffdd bgcolor="#feffdd"
薄紅 #ffccff bgcolor="#ffccff"
薄々紅 #ffeeff bgcolor="#ffeeff" <h1>  <h1> 候補
薄桃 #ffcccc bgcolor="#ffcccc"
薄々桃 #ffeeee bgcolor="#ffeeee"
薄水 #ccffff bgcolor="#ccffff"
薄々水 #efffff bgcolor="#efffff" タイトル行列
薄緑 #ccffcc bgcolor="#ccffcc" グローバルナビ 現在のページ
薄々緑 #efffef bgcolor="#efffef" タイトル行列
薄紫 #ccccff bgcolor="#ccccff"
薄々紫 #eeeeff bgcolor="#eeeeff"
オレンジ タイトル #ffa500 bgcolor="#ffa500" 旧 <h1>  <h1> 候補

目次 | 元のページ 前のページ | 次のページ サイトマップ | ページTOP
ホーム > HPB19 > HTML カラーパレット
   

© 2014 abhp.net All Rights Reserved.

参考情報


とほほの色入門・色見本

ページTOP
ページTOP
ページTOP
ページTOP
ページTOP
ページTOP