名前付き色見本
HTML3.2/4.0で規定されているのは次の 16色です。なお、HTML中では色名の大文字小文字の区別はありません。→ 黒地版
Black | | | #000000 | Gray | | | #808080 | Silver | | | #C0C0C0 | White | | | #FFFFFF | Maroon | | | #800000 | Red | | | #FF0000 | Purple | | | #800080 | Fuchsia | | | #FF00FF |
| | Green | | | #008000 | Lime | | | #00FF00 | Olive | | | #808000 | Yellow | | | #FFFF00 | Navy | | | #000080 | Blue | | | #0000FF | Teal | | | #008080 | Aqua | | | #00FFFF |
|
以下は、MozillaやMSIEで利用できる 140の名前付きの色見本です。右側が定義色です。WWWブラウザが対応していれば左右で同じ色が出ます。
| 名前順 | | name | rgb | 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 | DarkKhaki | | | #BDB76B | DarkMagenta | | | #8B008B | DarkOliveGreen | | | #556B2F | DarkOrange | | | #FF8C00 | DarkOrchid | | | #9932CC | DarkRed | | | #8B0000 | DarkSalmon | | | #E9967A | DarkSeaGreen | | | #8FBC8F | DarkSlateBlue | | | #483D8B | DarkSlateGray | | | #2F4F4F | DarkTurquoise | | | #00CED1 | DarkViolet | | | #9400D3 | DeepPink | | | #FF1493 | DeepSkyBlue | | | #00BFFF | DimGray | | | #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 | 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 | LightGreen | | | #90EE90 | LightGrey | | | #D3D3D3 | LightPink | | | #FFB6C1 | LightSalmon | | | #FFA07A | LightSeaGreen | | | #20B2AA | LightSkyBlue | | | #87CEFA | LightSlateGray | | | #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 | 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 |
| | | RGB順 | | name | rgb | Black | | | #000000 | Navy | | | #000080 | DarkBlue | | | #00008B | MediumBlue | | | #0000CD | Blue | | | #0000FF | DarkGreen | | | #006400 | Green | | | #008000 | Teal | | | #008080 | DarkCyan | | | #008B8B | DeepSkyBlue | | | #00BFFF | DarkTurquoise | | | #00CED1 | MediumSpringGreen | | | #00FA9A | Lime | | | #00FF00 | SpringGreen | | | #00FF7F | Aqua | | | #00FFFF | Cyan | | | #00FFFF | MidnightBlue | | | #191970 | DodgerBlue | | | #1E90FF | LightSeaGreen | | | #20B2AA | ForestGreen | | | #228B22 | SeaGreen | | | #2E8B57 | DarkSlateGray | | | #2F4F4F | LimeGreen | | | #32CD32 | MediumSeaGreen | | | #3CB371 | Turquoise | | | #40E0D0 | RoyalBlue | | | #4169E1 | SteelBlue | | | #4682B4 | DarkSlateBlue | | | #483D8B | MediumTurquoise | | | #48D1CC | Indigo | | | #4B0082 | DarkOliveGreen | | | #556B2F | CadetBlue | | | #5F9EA0 | CornflowerBlue | | | #6495ED | MediumAquamarine | | | #66CDAA | DimGray | | | #696969 | SlateBlue | | | #6A5ACD | OliveDrab | | | #6B8E23 | SlateGray | | | #708090 | LightSlateGray | | | #778899 | MediumSlateBlue | | | #7B68EE | LawnGreen | | | #7CFC00 | Chartreuse | | | #7FFF00 | Aquamarine | | | #7FFFD4 | Maroon | | | #800000 | Purple | | | #800080 | Olive | | | #808000 | Gray | | | #808080 | SkyBlue | | | #87CEEB | LightSkyBlue | | | #87CEFA | BlueViolet | | | #8A2BE2 | DarkRed | | | #8B0000 | DarkMagenta | | | #8B008B | SaddleBrown | | | #8B4513 | DarkSeaGreen | | | #8FBC8F | LightGreen | | | #90EE90 | MediumPurple | | | #9370DB | DarkViolet | | | #9400D3 | PaleGreen | | | #98FB98 | DarkOrchid | | | #9932CC | YellowGreen | | | #9ACD32 | Sienna | | | #A0522D | Brown | | | #A52A2A | DarkGray | | | #A9A9A9 | LightBlue | | | #ADD8E6 | GreenYellow | | | #ADFF2F | PaleTurquoise | | | #AFEEEE | LightSteelBlue | | | #B0C4DE | PowderBlue | | | #B0E0E6 | FireBrick | | | #B22222 | DarkGoldenrod | | | #B8860B | MediumOrchid | | | #BA55D3 | RosyBrown | | | #BC8F8F | DarkKhaki | | | #BDB76B | Silver | | | #C0C0C0 | MediumVioletRed | | | #C71585 | IndianRed | | | #CD5C5C | Peru | | | #CD853F | Chocolate | | | #D2691E | Tan | | | #D2B48C | LightGrey | | | #D3D3D3 | Thistle | | | #D8BFD8 | Orchid | | | #DA70D6 | Goldenrod | | | #DAA520 | PaleVioletRed | | | #DB7093 | Crimson | | | #DC143C | Gainsboro | | | #DCDCDC | Plum | | | #DDA0DD | Burlywood | | | #DEB887 | LightCyan | | | #E0FFFF | Lavender | | | #E6E6FA | DarkSalmon | | | #E9967A | Violet | | | #EE82EE | PaleGoldenrod | | | #EEE8AA | LightCoral | | | #F08080 | Khaki | | | #F0E68C | AliceBlue | | | #F0F8FF | Honeydew | | | #F0FFF0 | Azure | | | #F0FFFF | SandyBrown | | | #F4A460 | Wheat | | | #F5DEB3 | Beige | | | #F5F5DC | WhiteSmoke | | | #F5F5F5 | MintCream | | | #F5FFFA | GhostWhite | | | #F8F8FF | Salmon | | | #FA8072 | AntiqueWhite | | | #FAEBD7 | Linen | | | #FAF0E6 | LightGoldenrodYellow | | | #FAFAD2 | OldLace | | | #FDF5E6 | Red | | | #FF0000 | Magenta | | | #FF00FF | Fuchsia | | | #FF00FF | DeepPink | | | #FF1493 | OrangeRed | | | #FF4500 | Tomato | | | #FF6347 | HotPink | | | #FF69B4 | Coral | | | #FF7F50 | DarkOrange | | | #FF8C00 | LightSalmon | | | #FFA07A | Orange | | | #FFA500 | LightPink | | | #FFB6C1 | Pink | | | #FFC0CB | Gold | | | #FFD700 | PeachPuff | | | #FFDAB9 | NavajoWhite | | | #FFDEAD | Moccasin | | | #FFE4B5 | Bisque | | | #FFE4C4 | MistyRose | | | #FFE4E1 | BlanchedAlmond | | | #FFEBCD | PapayaWhip | | | #FFEFD5 | LavenderBlush | | | #FFF0F5 | SeaShell | | | #FFF5EE | CornSilk | | | #FFF8DC | LemonChiffon | | | #FFFACD | FloralWhite | | | #FFFAF0 | Snow | | | #FFFAFA | Yellow | | | #FFFF00 | LightYellow | | | #FFFFE0 | Ivory | | | #FFFFF0 | White | | | #FFFFFF |
|
これらの名前の多くは、どうやら X Window System から来ているようですが、いくらか定義値に食い違いがあります。X11R6のrgb.txtとの食い違いは次の 4色です。
| HTML | X11R6 |
Gray #808080 | | | #BEBEBE |
Green #008000 | | | #00FF00 |
Maroon #800000 | | | #B03060 |
Purple #800080 | | | #A020F0 |
- 注意
- Mozilla4.02以前では AliceBlue が正しく発色しません。
- Aqua と Cyan、Magenta と Fuchsia は同じ色です。
- LightGrey だけ Gray ではありません。この理由をどこかで読んだ記憶があるのですが、失念してしまいました。ご存知でしたら k16@chiba.email.ne.jp までお教えください。
- 正しいHTML4.0 リファレンス&作法 第2版の色名称早見表に、HoneydewTad という名前が出てくる。出典に関して問合せ中だが、返事はない。
216色見本
|
#000000 | | Black |
#333333 | |
#666666 | |
#808080 | | Gray |
#999999 | |
#CCCCCC | |
#FFFFFF | | White |
| 00 | 33 | 66 | 99 | CC | FF |
#0000XX | | | | | | |
#0033XX | | | | | | |
#0066XX | | | | | | |
#0099XX | | | | | | |
#00CCXX | | | | | | |
#00FFXX | | | | | | |
| 00 | 33 | 66 | 99 | CC | FF |
#3300XX | | | | | | |
#3333XX | | | | | | |
#3366XX | | | | | | |
#3399XX | | | | | | |
#33CCXX | | | | | | |
#33FFXX | | | | | | |
| 00 | 33 | 66 | 99 | CC | FF |
#6600XX | | | | | | |
#6633XX | | | | | | |
#6666XX | | | | | | |
#6699XX | | | | | | |
#66CCXX | | | | | | |
#66FFXX | | | | | | |
| 00 | 33 | 66 | 99 | CC | FF |
#9900XX | | | | | | |
#9933XX | | | | | | |
#9966XX | | | | | | |
#9999XX | | | | | | |
#99CCXX | | | | | | |
#99FFXX | | | | | | |
| 00 | 33 | 66 | 99 | CC | FF |
#CC00XX | | | | | | |
#CC33XX | | | | | | |
#CC66XX | | | | | | |
#CC99XX | | | | | | |
#CCCCXX | | | | | | |
#CCFFXX | | | | | | |
| 00 | 33 | 66 | 99 | CC | FF |
#FF00XX | | | | | | |
#FF33XX | | | | | | |
#FF66XX | | | | | | |
#FF99XX | | | | | | |
#FFCCXX | | | | | | |
#FFFFXX | | | | | | |
- 注意
- 256色環境の場合、上記216色+規定16色-重複8色=224色なのでこれで十分です。残りの32色は環境依存のようです。
- ただし、Windowsの256色環境のMSIE3~5では、#0033FF、#00FF33、#3300FF、#33FF00 の4色は正しく発色しません。
システム色見本
システム色とは、OSなどが管理している色のことで、CSS2に、次の 28色の名前が規定されています。WWWブラウザが対応していれば、何かそれなりの色が出るでしょう 。左がスタイルシートを使った style="background-color:xxxx" という指定、右が bgcolor="xxxx" という指定。
|
| style | bgcolor |
ActiveBorder | | | アクティヴウィンドウの境界 |
ActiveCaption | | | アクティヴウィンドウのタイトルの背景 |
AppWorkspace | | | アプリケーションの背景 |
Background | | | デスクトップの背景 |
ButtonFace | | | ボタンの表面 |
ButtonHhighlight | | | ボタンの縁の明部 |
ButtonShadow | | | ボタンの縁の影 |
ButtonText | | | ボタンのテキスト |
CaptionText | | | タイトルのテキスト |
GrayText | | | グレイテキスト |
Highlight | | | 選択された項目の背景 |
HighlightText | | | 選択された項目のテキスト |
InactiveBorder | | | 非アクティヴウィンドウの境界 |
InactiveCaption | | | 非アクティヴウィンドウのタイトルの背景 |
InactiveCaptionText | | | 非アクティヴウィンドウのタイトルのテキスト |
InfoBackground | | | ヒントの背景 |
InfoText | | | ヒントのテキスト |
Menu | | | メニューの背景 |
MenuText | | | メニューのテキスト |
Scrollbar | | | スクロールバー |
ThreeDDarkShadow | | | 立体表示の暗い影 |
ThreeDFace | | | 立体表示の表面 |
ThreeDHighlight | | | 立体表示の明部 |
ThreeDLightShadow | | | 立体表示の明るい影 |
ThreeDShadow | | | 立体表示の影 |
Window | | | ウィンドウの背景 |
WindowFrame | | | ウィンドウの枠 |
WindowText | | | ウィンドウ内のテキスト |
このHTMLチェックはHTML-Lintを利用しています。詳しい情報はHTML-Lintのプライマリーサイトを参考ください。
このサイトの責任者はcolor-web.netの管理者になります。
htmllint.cgi ver1.19 / htmllint.pm ver3.23