このウェブサイトはご利用の端末での閲覧に対応していません。
This website does not support your device.

<named-color>”値~カラーネーム

記事Mar. 1st,2021
色の指定に使用することができるカラーネーム、“<named-color>”値。
この記事はCSS3に対応しています。
この記事はCSS3に対応しています。

“カラーネーム”とは?

<named-color>”値

カラーネーム”と呼ばれることの多い“<named-color>”値は色の指定を容易にするために定義された色を表すキーワードです。カラーネームは<color>”値として使用することができます。

カラーネームは大きく2種類に分類されます。一つはVGAパレットからHTMLの仕様に移入された16色の“基本色(Basic color keywords)”です。これらの16色はHTML4.01までHTMLの仕様書にも定義されていました。“VGA色(VGA colors)”とも呼ばれます。“CSS Level 2”の仕様では16色に加えて“orange(#FFA500)”を定義しました。

もう一つはX Window Systemで色を表すために使用され、SVGの仕様に移入された“拡張色(Extended color keywords)”です。初期に広く普及していたブラウザ、Netscape Navigatorでもこれらのカラーネームが使用されたため、事実上の標準として普及しました。“X11色(X11 colors)”とも呼ばれますが、X Window Systemで表現される色とCSSの使用で定義された色の色合いは異なる場合があります。

なお、“CSS Color Module Level 4”ではカラーネームは広く普及しているために仕様書で標準化されているものの、使用が奨励されているものではないとしています。理由としてはカラーネームがsRGB色空間の中で均等に分布していないことや、色の名前に一貫性がないことなどが挙げられています。

<named-color>”値が使用できる場所では透明を表すtransparentも使用できます。

仕様書

カラーネームの一覧

VGA色

カラーネーム 16進数カラーコード “rgb()”関数
black #000000 rgb(0,0,0)
silver #C0C0C0 rgb(192,192,192)
gray #808080 rgb(128,128,128)
white #FFFFFF rgb(255,255,255)
maroon #800000 rgb(128,0,0)
red #FF0000 rgb(255,0,0)
purple #800080 rgb(128,0,128)
fuchsia #FF00FF rgb(128,128,128)
green #008000 rgb(0,128,0)
lime #00FF00 rgb(0,255,0)
olive #808000 rgb(0,255,0)
yellow #FFFF00 rgb(255,255,0)
navy #000080 rgb(0,0,128)
blue #0000FF rgb(0,0,255)
teal #008080 rgb(0,128,128)
aqua #00FFFF rgb(0,255,255)

X11色

カラーネーム 16進数カラーコード “rgb()”関数
aliceblue #F0F8FF rgb(240,248,255)
antiquewhite #FAEBD7 rgb(250,235,215)
aqua #00FFFF rgb(0,255,255)
aquamarine #7FFFD4 rgb(127,255,212)
azure #F0FFFF rgb(240,255,255)
beige #F5F5DC rgb(245,245,220)
bisque #FFE4C4 rgb(255,228,196)
black #000000 rgb(0,0,0)
blanchedalmond #FFEBCD rgb(255,235,205)
blue #0000FF rgb(0,0,255)
blueviolet #8A2BE2 rgb(138,43,226)
brown #A52A2A rgb(165,42,42)
burlywood #DEB887 rgb(222,184,135)
cadetblue #5F9EA0 rgb(95,158,160)
chartreuse #7FFF00 rgb(127,255,0)
chocolate #D2691E rgb(210,105,30)
coral #FF7F50 rgb(255,127,80)
cornflowerblue #6495ED rgb(100,149,237)
cornsilk #FFF8DC rgb(255,248,220)
crimson #DC143C rgb(220,20,60)
cyan #00FFFF rgb(0,255,255)
darkblue #00008B rgb(0,0,139)
darkcyan #008B8B rgb(0,139,139)
darkgoldenrod #B8860B rgb(184,134,11)
darkgray #A9A9A9 rgb(169,169,169)
darkgreen #006400 rgb(0,100,0)
darkgrey #A9A9A9 rgb(169,169,169)
darkkhaki #BDB76B rgb(189,183,107)
darkmagenta #8B008B rgb(139,0,139)
darkolivegreen #556B2F rgb(85,107,47)
darkorange #FF8C00 rgb(255,140,0)
darkorchid #9932CC rgb(153,50,204)
darkred #8B0000 rgb(139,0,0)
darksalmon #E9967A rgb(233,150,122)
darkseagreen #8FBC8F rgb(143,188,143)
darkslateblue #483D8B rgb(72,61,139)
darkslategray #2F4F4F rgb(47,79,79)
darkslategrey #2F4F4F rgb(47,79,79)
darkturquoise #00CED1 rgb(0,206,209)
darkviolet #9400D3 rgb(148,0,211)
deeppink #FF1493 rgb(255,20,147)
deepskyblue #00BFFF rgb(0,191,255)
dimgray #696969 rgb(105,105,105)
dimgrey #696969 rgb(105,105,105)
dodgerblue #1E90FF rgb(30,144,255)
firebrick #B22222 rgb(178,34,34)
floralwhite #FFFAF0 rgb(255,250,240)
forestgreen #228B22 rgb(34,139,34)
fuchsia #FF00FF rgb(255,0,255)
gainsboro #DCDCDC rgb(220,220,220)
ghostwhite #F8F8FF rgb(248,248,255)
gold #FFD700 rgb(255,215,0)
goldenrod #DAA520 rgb(218,165,32)
gray #808080 rgb(128,128,128)
green #008000 rgb(0,128,0)
greenyellow #ADFF2F rgb(173,255,47)
grey #808080 rgb(128,128,128)
honeydew #F0FFF0 rgb(240,255,240)
hotpink #FF69B4 rgb(255,105,180)
indianred #CD5C5C rgb(205,92,92)
indigo #4B0082 rgb(75,0,130)
ivory #FFFFF0 rgb(255,255,240)
khaki #F0E68C rgb(240,230,140)
lavender #E6E6FA rgb(230,230,250)
lavenderblush #FFF0F5 rgb(255,240,245)
lawngreen #7CFC00 rgb(124,252,0)
lemonchiffon #FFFACD rgb(255,250,205)
lightblue #ADD8E6 rgb(173,216,230)
lightcoral #F08080 rgb(240,128,128)
lightcyan #E0FFFF rgb(224,255,255)
lightgoldenrodyellow #FAFAD2 rgb(250,250,210)
lightgray #D3D3D3 rgb(211,211,211)
lightgreen #90EE90 rgb(144,238,144)
lightgrey #D3D3D3 rgb(211,211,211)
lightpink #FFB6C1 rgb(255,182,193)
lightsalmon #FFA07A rgb(255,160,122)
lightseagreen #20B2AA rgb(32,178,170)
lightskyblue #87CEFA rgb(135,206,250)
lightslategray #778899 rgb(119,136,153)
lightslategrey #778899 rgb(119,136,153)
lightsteelblue #B0C4DE rgb(176,196,222)
lightyellow #FFFFE0 rgb(255,255,224)
lime #00FF00 rgb(0,255,0)
limegreen #32CD32 rgb(50,205,50)
linen #FAF0E6 rgb(250,240,230)
magenta #FF00FF rgb(255,0,255)
maroon #800000 rgb(128,0,0)
mediumaquamarine #66CDAA rgb(102,205,170)
mediumblue #0000CD rgb(0,0,205)
mediumorchid #BA55D3 rgb(186,85,211)
mediumpurple #9370DB rgb(147,112,219)
mediumseagreen #3CB371 rgb(60,179,113)
mediumslateblue #7B68EE rgb(123,104,238)
mediumspringgreen #00FA9A rgb(0,250,154)
mediumturquoise #48D1CC rgb(72,209,204)
mediumvioletred #C71585 rgb(199,21,133)
midnightblue #191970 rgb(25,25,112)
mintcream #F5FFFA rgb(245,255,250)
mistyrose #FFE4E1 rgb(255,228,225)
moccasin #FFE4B5 rgb(255,228,181)
navajowhite #FFDEAD rgb(255,222,173)
navy #000080 rgb(0,0,128)
oldlace #FDF5E6 rgb(253,245,230)
olive #808000 rgb(128,128,0)
olivedrab #6B8E23 rgb(107,142,35)
orange #FFA500 rgb(255,165,0)
orangered #FF4500 rgb(255,69,0)
orchid #DA70D6 rgb(218,112,214)
palegoldenrod #EEE8AA rgb(238,232,170)
palegreen #98FB98 rgb(152,251,152)
paleturquoise #AFEEEE rgb(175,238,238)
palevioletred #DB7093 rgb(219,112,147)
papayawhip #FFEFD5 rgb(255,239,213)
peachpuff #FFDAB9 rgb(255,218,185)
peru #CD853F rgb(205,133,63)
pink #FFC0CB rgb(255,192,203)
plum #DDA0DD rgb(221,160,221)
powderblue #B0E0E6 rgb(176,224,230)
purple #800080 rgb(128,0,128)
rebeccapurple #663399 rgb(102,51,153)
red #FF0000 rgb(255,0,0)
rosybrown #BC8F8F rgb(188,143,143)
royalblue #4169E1 rgb(65,105,225)
saddlebrown #8B4513 rgb(139,69,19)
salmon #FA8072 rgb(250,128,114)
sandybrown #F4A460 rgb(244,164,96)
seagreen #2E8B57 rgb(46,139,87)
seashell #FFF5EE rgb(255,245,238)
sienna #A0522D rgb(160,82,45)
silver #C0C0C0 rgb(192,192,192)
skyblue #87CEEB rgb(135,206,235)
slateblue #6A5ACD rgb(106,90,205)
slategray #708090 rgb(112,128,144)
slategrey #708090 rgb(112,128,144)
snow #FFFAFA rgb(255,250,250)
springgreen #00FF7F rgb(0,255,127)
steelblue #4682B4 rgb(70,130,180)
tan #D2B48C rgb(210,180,140)
teal #008080 rgb(0,128,128)
thistle #D8BFD8 rgb(216,191,216)
tomato #FF6347 rgb(255,99,71)
turquoise #40E0D0 rgb(64,224,208)
violet #EE82EE rgb(238,130,238)
wheat #F5DEB3 rgb(245,222,179)
white #FFFFFF rgb(255,255,255)
whitesmoke #F5F5F5 rgb(245,245,245)
yellow #FFFF00 rgb(255,255,0)
yellowgreen #9ACD32 rgb(154,205,50)
一番上へ
トップにもどる
シェアする
シェアする
Facebookでシェアする
ツイート
Google+でシェア
Pocket
はてなブックマーク