前にグレー階調のざっくり色リストを作ったことがありましたが⇒こちら html(css)で色を指定する時、「#ff0000」のような16進数表記をしますが、幾つかの色には名前がついておりまして。16進数の代わりに名前で指定する事ができますね。 例えば「#ff0000」ならば「red」と書いたほうが速いし分かりやすい。 なので、私は極力、色の名前を指定するようにしています（色に関してズボラ＝センスがないだけかも知れませんが。） しかし、割りと簡単な名前の色はソラで使えますが、結構特殊な名前の色もあって、そういうのはいちいち調べてまで使いませんが(^^;) 原色系の色は、割りと分かりやすい名前ですね、英語の色の名前そのままですから。
| 赤 | red | |
| 青 | blue | |
| 緑 | green | |
| 黒 | black | |
| 白 | white | |
| 黄 | yellow | |
| 紫 | purple | |
| 茶 | brown | |
| ピンク | pink | |
| オレンジ | orange |
原色・基本色系は他にもあるのですが、名前見てピンと来ないので・・・ オリーブはまぁ分かるけど、マルーンとかテールとかフクシャとか言われても、何色それ？？？(笑) （※マルーンは栗色、マロンから来てるらしい。かなり赤っぽいダークな茶色？栗の身の中身の色ではなく、栗の剥く前の皮の色かな？）
この原色に、「dark」とか「light」とか付く色も有ります、少し暗くしたり明るくなったりしますね。
| light付加 | 原色 | dark付加 |
|---|---|---|
| × | red | darkred |
| lightblue | blue | darkblue |
| lightgreen | green | darkgreen |
| × | black | × |
| × | white | × |
| lightyellow | yellow | × |
| × | purple | × |
| × | brown | × |
| lightpink | pink | × |
| × | orange | darkorange |
こうしてみると、意外と少ないですね、「ダーク」と「ライト」が両方使えるのはブルーとグリーンだけなんですね・・・
ダークホワイトとかライトブラックとかはないのですね(^^;)
ダークブラウン・ライトブラウンがないのはちょっと意外ですね
ダークパープル・ライトパープルはありそうだと思ったけれどない。
（※ディープパープルもありません・笑)
ライトピンクはピンクより濃いんですねぇ・・・
他に、原色ほどではないですが、名前を見れば分かる色は ivory violet skyblue gold tomato olive navy などがありますね。
そこまでメジャーではないけれど、多少専門的な知識があればピンと来る色 crimson （絵の具でありますね） cyan （印刷関係者なら？） magenta （印刷関係者なら？） tan （皮革加工関係者なら？）
ライト・ダークのほかに、ディープが付くのがありました deeppink （ディープピンク） deepskyblue （ディープスカイブルー） ※ただし、deepが付くのはこの2色だけ 他にホットが付くのもありますが、これは一色だけ hotpink （ホットピンク）
他に、名前を見れば、なんとなく分かりますが、アルファベットで書かれると長くてよ～くみないと分からないタイプ(笑) springgreen （スプリング・グリーン） mediumspringgreen （ミディアムスプリンググリーン） mediumblue （ミディアムブルー） seagreen （シーグリーン） aquamarine （アクアマリン） greenyellow （グリーンイエロー） orangered （オレンジレッド） lime （ライム） linen （リネン） chocolate （チョコレート） ちょっと変わったところでは goldenrod これって、金の延べ棒だと思うのですが、検索すると、アキノキリンソウという植物の名前って出てきますね・・・でも名前の直訳通り単に金の棒なのか・・・黄色い花のようですが。。。
ブラウザに名前が定義されているのは140色
| black | aliceblue | darkcyan | lightyellow | coral | |||||
| dimgray | lavender | teal | lightgoldenrodyellow | tomato | |||||
| gray | lightsteelblue | darkslategray | lemonchiffon | orangered | |||||
| darkgray | lightslategray | darkgreen | wheat | red | |||||
| silver | slategray | green | burlywood | crimson | |||||
| lightgrey | steelblue | forestgreen | tan | mediumvioletred | |||||
| gainsboro | royalblue | seagreen | khaki | deeppink | |||||
| whitesmoke | midnightblue | mediumseagreen | yellow | hotpink | |||||
| white | navy | mediumaquamarine | gold | palevioletred | |||||
| snow | darkblue | darkseagreen | orange | pink | |||||
| ghostwhite | mediumblue | aquamarine | sandybrown | lightpink | |||||
| floralwhite | blue | palegreen | darkorange | thistle | |||||
| linen | dodgerblue | lightgreen | goldenrod | magenta | |||||
| antiquewhite | cornflowerblue | springgreen | peru | fuchsia | |||||
| papayawhip | deepskyblue | mediumspringgreen | darkgoldenrod | violet | |||||
| blanchedalmond | lightskyblue | lawngreen | chocolate | plum | |||||
| bisque | skyblue | chartreuse | sienna | orchid | |||||
| moccasin | lightblue | greenyellow | saddlebrown | mediumorchid | |||||
| navajowhite | powderblue | lime | maroon | darkorchid | |||||
| peachpuff | paleturquoise | limegreen | darkred | darkviolet | |||||
| mistyrose | lightcyan | yellowgreen | brown | darkmagenta | |||||
| lavenderblush | cyan | darkolivegreen | firebrick | purple | |||||
| seashell | aqua | olivedrab | indianred | indigo | |||||
| oldlace | turquoise | olive | rosybrown | darkslateblue | |||||
| ivory | mediumturquoise | darkkhaki | darksalmon | blueviolet | |||||
| honeydew | darkturquoise | palegoldenrod | lightcoral | mediumpurple | |||||
| mintcream | lightseagreen | cornsilk | salmon | slateblue | |||||
| azure | cadetblue | beige | lightsalmon | mediumslateblue |
darkが付いてるのは17色 darkcyan darkslategray darkgray darkgreen darkblue darkseagreen darkorange darkgoldenrod darkorchid darkred darkviolet darkmagenta darkolivegreen darkslateblue darkkhaki darksalmon darkturquoise
lightが付くのは13色 lightyellow lightgoldenrodyellow lightsteelblue lightslategray lightgrey lightpink lightgreen lightskyblue lightblue lightcyan lightcoral lightseagreen lightsalmon
paleがつくのは4色 palevioletred palegreen paleturquoise palegoldenrod
seaがつく色 seagreen mediumseagreen darkseagreen seashell lightseagreen
skyがつく色 deepskyblue lightskyblue skyblue
名前がついた色についての反対色（反転色）と補色のリストがなかったので作ってみた
（背景色に対して●が反転色／補色になっている）
| カラーネーム | カラーコード | 反転色 | 補色 | ||
|---|---|---|---|---|---|
| black | #000000 | #ffffff | ●●● | #000000 | ●●● |
| dimgray | #696969 | #969696 | ●●● | #696969 | ●●● |
| gray | #808080 | #7f7f7f | ●●● | #808080 | ●●● |
| darkgray | #a9a9a9 | #565656 | ●●● | #a9a9a9 | ●●● |
| silver | #c0c0c0 | #3f3f3f | ●●● | #c0c0c0 | ●●● |
| lightgrey | #d3d3d3 | #2c2c2c | ●●● | #d3d3d3 | ●●● |
| gainsboro | #dcdcdc | #232323 | ●●● | #dcdcdc | ●●● |
| whitesmoke | #f5f5f5 | #0a0a0a | ●●● | #f5f5f5 | ●●● |
| white | #ffffff | #000000 | ●●● | #ffffff | ●●● |
| snow | #fffafa | #000505 | ●●● | #faffff | ●●● |
| ghostwhite | #f8f8ff | #070700 | ●●● | #fffff8 | ●●● |
| floralwhite | #fffaf0 | #00050f | ●●● | #f0f5ff | ●●● |
| linen | #faf0e6 | #050f19 | ●●● | #e6f0fa | ●●● |
| antiquewhite | #faebd7 | #051428 | ●●● | #d7e6fa | ●●● |
| papayawhip | #ffefd5 | #00102a | ●●● | #d5e5ff | ●●● |
| blanchedalmond | #ffebcd | #001432 | ●●● | #cde1ff | ●●● |
| bisque | #ffe4c4 | #001b3b | ●●● | #c4dfff | ●●● |
| moccasin | #ffe4b5 | #001b4a | ●●● | #b5d0ff | ●●● |
| navajowhite | #ffdead | #002152 | ●●● | #adceff | ●●● |
| peachpuff | #ffdab9 | #002546 | ●●● | #b9deff | ●●● |
| mistyrose | #ffe4e1 | #001b1e | ●●● | #e1fcff | ●●● |
| lavenderblush | #fff0f5 | #000f0a | ●●● | #f0fffa | ●●● |
| seashell | #fff5ee | #000a11 | ●●● | #eef8ff | ●●● |
| oldlace | #fdf5e6 | #020a19 | ●●● | #e6eefd | ●●● |
| ivory | #fffff0 | #00000f | ●●● | #f0f0ff | ●●● |
| honeydew | #f0fff0 | #0f000f | ●●● | #fff0ff | ●●● |
| mintcream | #f5fffa | #0a0005 | ●●● | #fff5fa | ●●● |
| azure | #f0ffff | #0f0000 | ●●● | #fff0f0 | ●●● |
| aliceblue | #f0f8ff | #0f0700 | ●●● | #fff7f0 | ●●● |
| lavender | #e6e6fa | #191905 | ●●● | #fafae6 | ●●● |
| lightsteelblue | #b0c4de | #4f3b21 | ●●● | #decab0 | ●●● |
| lightslategray | #778899 | #887766 | ●●● | #998877 | ●●● |
| slategray | #708090 | #8f7f6f | ●●● | #908070 | ●●● |
| steelblue | #4682b4 | #b97d4b | ●●● | #b47846 | ●●● |
| royalblue | #4169e1 | #be961e | ●●● | #e1b941 | ●●● |
| midnightblue | #191970 | #e6e68f | ●●● | #707019 | ●●● |
| navy | #000080 | #ffff7f | ●●● | #808000 | ●●● |
| darkblue | #00008b | #ffff74 | ●●● | #8b8b00 | ●●● |
| mediumblue | #0000cd | #ffff32 | ●●● | #cdcd00 | ●●● |
| blue | #0000ff | #ffff00 | ●●● | #ffff00 | ●●● |
| dodgerblue | #1e90ff | #e16f00 | ●●● | #ff8d1e | ●●● |
| cornflowerblue | #6495ed | #9b6a12 | ●●● | #edbc64 | ●●● |
| deepskyblue | #00bfff | #ff4000 | ●●● | #ff4000 | ●●● |
| lightskyblue | #87cefa | #783105 | ●●● | #fab387 | ●●● |
| skyblue | #87ceeb | #783114 | ●●● | #eba487 | ●●● |
| lightblue | #add8e6 | #522719 | ●●● | #e6bbad | ●●● |
| powderblue | #b0e0e6 | #4f1f19 | ●●● | #e6b6b0 | ●●● |
| paleturquoise | #afeeee | #501111 | ●●● | #eeafaf | ●●● |
| lightcyan | #e0ffff | #1f0000 | ●●● | #ffe0e0 | ●●● |
| cyan | #00ffff | #ff0000 | ●●● | #ff0000 | ●●● |
| aqua | #00ffff | #ff0000 | ●●● | #ff0000 | ●●● |
| turquoise | #40e0d0 | #bf1f2f | ●●● | #e04050 | ●●● |
| mediumturquoise | #48d1cc | #b72e33 | ●●● | #d1484d | ●●● |
| darkturquoise | #00ced1 | #ff312e | ●●● | #d10300 | ●●● |
| lightseagreen | #20b2aa | #df4d55 | ●●● | #b22028 | ●●● |
| cadetblue | #5f9ea0 | #a0615f | ●●● | #a0615f | ●●● |
| darkcyan | #008b8b | #ff7474 | ●●● | #8b0000 | ●●● |
| teal | #008080 | #ff7f7f | ●●● | #800000 | ●●● |
| darkslategray | #2f4f4f | #d0b0b0 | ●●● | #4f2f2f | ●●● |
| darkgreen | #006400 | #ff9bff | ●●● | #640064 | ●●● |
| green | #008000 | #ff7fff | ●●● | #800080 | ●●● |
| forestgreen | #228b22 | #dd74dd | ●●● | #8b228b | ●●● |
| seagreen | #2e8b57 | #d174a8 | ●●● | #8b2e62 | ●●● |
| mediumseagreen | #3cb371 | #c34c8e | ●●● | #b33c7e | ●●● |
| mediumaquamarine | #66cdaa | #993255 | ●●● | #cd6689 | ●●● |
| darkseagreen | #8fbc8f | #704370 | ●●● | #bc8fbc | ●●● |
| aquamarine | #7fffd4 | #80002b | ●●● | #ff7faa | ●●● |
| palegreen | #98fb98 | #670467 | ●●● | #fb98fb | ●●● |
| lightgreen | #90ee90 | #6f116f | ●●● | #ee90ee | ●●● |
| springgreen | #00ff7f | #ff0080 | ●●● | #ff0080 | ●●● |
| mediumspringgreen | #00fa9a | #ff0565 | ●●● | #fa0060 | ●●● |
| lawngreen | #7cfc00 | #8303ff | ●●● | #8000fc | ●●● |
| chartreuse | #7fff00 | #8000ff | ●●● | #8000ff | ●●● |
| greenyellow | #adff2f | #5200d0 | ●●● | #812fff | ●●● |
| lime | #00ff00 | #ff00ff | ●●● | #ff00ff | ●●● |
| limegreen | #32cd32 | #cd32cd | ●●● | #cd32cd | ●●● |
| yellowgreen | #9acd32 | #6532cd | ●●● | #6532cd | ●●● |
| darkolivegreen | #556b2f | #aa94d0 | ●●● | #452f6b | ●●● |
| olivedrab | #6b8e23 | #9471dc | ●●● | #46238e | ●●● |
| olive | #808000 | #7f7fff | ●●● | #000080 | ●●● |
| darkkhaki | #bdb76b | #424894 | ●●● | #6b71bd | ●●● |
| palegoldenrod | #eee8aa | #111755 | ●●● | #aab0ee | ●●● |
| cornsilk | #fff8dc | #000723 | ●●● | #dce3ff | ●●● |
| beige | #f5f5dc | #0a0a23 | ●●● | #dcdcf5 | ●●● |
| lightyellow | #ffffe0 | #00001f | ●●● | #e0e0ff | ●●● |
| lightgoldenrodyellow | #fafad2 | #05052d | ●●● | #d2d2fa | ●●● |
| lemonchiffon | #fffacd | #000532 | ●●● | #cdd2ff | ●●● |
| wheat | #f5deb3 | #0a214c | ●●● | #b3caf5 | ●●● |
| burlywood | #deb887 | #214778 | ●●● | #87adde | ●●● |
| tan | #d2b48c | #2d4b73 | ●●● | #8caad2 | ●●● |
| khaki | #f0e68c | #0f1973 | ●●● | #8c96f0 | ●●● |
| yellow | #ffff00 | #0000ff | ●●● | #0000ff | ●●● |
| gold | #ffd700 | #0028ff | ●●● | #0028ff | ●●● |
| orange | #ffa500 | #005aff | ●●● | #005aff | ●●● |
| sandybrown | #f4a460 | #0b5b9f | ●●● | #60b0f4 | ●●● |
| darkorange | #ff8c00 | #0073ff | ●●● | #0073ff | ●●● |
| goldenrod | #daa520 | #255adf | ●●● | #2055da | ●●● |
| peru | #cd853f | #327ac0 | ●●● | #3f87cd | ●●● |
| darkgoldenrod | #b8860b | #4779f4 | ●●● | #0b3db8 | ●●● |
| chocolate | #d2691e | #2d96e1 | ●●● | #1e87d2 | ●●● |
| sienna | #a0522d | #5fadd2 | ●●● | #2d7ba0 | ●●● |
| saddlebrown | #8b4513 | #74baec | ●●● | #13598b | ●●● |
| maroon | #800000 | #7fffff | ●●● | #008080 | ●●● |
| darkred | #8b0000 | #74ffff | ●●● | #008b8b | ●●● |
| brown | #a52a2a | #5ad5d5 | ●●● | #2aa5a5 | ●●● |
| firebrick | #b22222 | #4ddddd | ●●● | #22b2b2 | ●●● |
| indianred | #cd5c5c | #32a3a3 | ●●● | #5ccdcd | ●●● |
| rosybrown | #bc8f8f | #437070 | ●●● | #8fbcbc | ●●● |
| darksalmon | #e9967a | #166985 | ●●● | #7acde9 | ●●● |
| lightcoral | #f08080 | #0f7f7f | ●●● | #80f0f0 | ●●● |
| salmon | #fa8072 | #057f8d | ●●● | #72ecfa | ●●● |
| lightsalmon | #ffa07a | #005f85 | ●●● | #7ad9ff | ●●● |
| coral | #ff7f50 | #0080af | ●●● | #50d0ff | ●●● |
| tomato | #ff6347 | #009cb8 | ●●● | #47e3ff | ●●● |
| orangered | #ff4500 | #00baff | ●●● | #00baff | ●●● |
| red | #ff0000 | #00ffff | ●●● | #00ffff | ●●● |
| crimson | #dc143c | #23ebc3 | ●●● | #14dcb4 | ●●● |
| mediumvioletred | #c71585 | #38ea7a | ●●● | #15c757 | ●●● |
| deeppink | #ff1493 | #00eb6c | ●●● | #14ff80 | ●●● |
| hotpink | #ff69b4 | #00964b | ●●● | #69ffb4 | ●●● |
| palevioletred | #db7093 | #248f6c | ●●● | #70dbb8 | ●●● |
| pink | #ffc0cb | #003f34 | ●●● | #c0fff4 | ●●● |
| lightpink | #ffb6c1 | #00493e | ●●● | #b6fff4 | ●●● |
| thistle | #d8bfd8 | #274027 | ●●● | #bfd8bf | ●●● |
| magenta | #ff00ff | #00ff00 | ●●● | #00ff00 | ●●● |
| fuchsia | #ff00ff | #00ff00 | ●●● | #00ff00 | ●●● |
| violet | #ee82ee | #117d11 | ●●● | #82ee82 | ●●● |
| plum | #dda0dd | #225f22 | ●●● | #a0dda0 | ●●● |
| orchid | #da70d6 | #258f29 | ●●● | #70da74 | ●●● |
| mediumorchid | #ba55d3 | #45aa2c | ●●● | #6ed355 | ●●● |
| darkorchid | #9932cc | #66cd33 | ●●● | #65cc32 | ●●● |
| darkviolet | #9400d3 | #6bff2c | ●●● | #3fd300 | ●●● |
| darkmagenta | #8b008b | #74ff74 | ●●● | #008b00 | ●●● |
| purple | #800080 | #7fff7f | ●●● | #008000 | ●●● |
| indigo | #4b0082 | #b4ff7d | ●●● | #378200 | ●●● |
| darkslateblue | #483d8b | #b7c274 | ●●● | #808b3d | ●●● |
| blueviolet | #8a2be2 | #75d41d | ●●● | #83e22b | ●●● |
| mediumpurple | #9370db | #6c8f24 | ●●● | #b8db70 | ●●● |
| slateblue | #6a5acd | #95a532 | ●●● | #bdcd5a | ●●● |
| mediumslateblue | #7b68ee | #849711 | ●●● | #dbee68 | ●●● |
反転色も補色も、淡色系（メイドが中間に近い）ほど差異が少なく、コントラストが弱くなってしまうのですね。
視認性を高めるためにコントラストを上げる事を考えたら、反転色・補色とは違うアプローチが必要なのか・・・
コメント