カラーコードの一覧表(色を調べる/色を作る)

カラーコードの一覧表です。スライダーやカラーピッカーで色の作成もできます。

目次	カラーコードの一覧表
	RGBの色をスライダーで作成する
	16進数のRGBの色をカラーピッカーで指定/確認する
	カラーコードの使用例 / 色に透明度を付ける

カラーコードの一覧表

color	Color name	#rrggbb	rgb(n,n,n)
	IndianRed	#CD5C5C	205,92,92
	LightCoral	#F08080	240,128,128
	Salmon	#FA8072	250,128,114
	DarkSalmon	#E9967A	233,150,122
	LightSalmon	#FFA07A	255,160,122
	Crimson	#DC143C	220,20,60
	Red	#FF0000	255,0,0
	FireBrick	#B22222	178,34,34
	DarkRed	#8B0000	139,0,0
	Pink	#FFC0CB	255,192,203
	LightPink	#FFB6C1	255,182,193
	HotPink	#FF69B4	255,105,180
	DeepPink	#FF1493	255,20,147
	MediumVioletRed	#C71585	199,21,133
	PaleVioletRed	#DB7093	219,112,147
	Coral	#FF7F50	255,127,80
	Tomato	#FF6347	255,99,71
	OrangeRed	#FF4500	255,69,0
	DarkOrange	#FF8C00	255,140,0
	Orange	#FFA500	255,165,0
	Gold	#FFD700	255,215,0
	Yellow	#FFFF00	255,255,0
	LightYellow	#FFFFE0	255,255,224
	LemonChiffon	#FFFACD	255,250,205
	LightGoldenrodYellow	#FAFAD2	250,250,210
	PapayaWhip	#FFEFD5	255,239,213
	Moccasin	#FFE4B5	255,228,181
	PeachPuff	#FFDAB9	255,218,185
	PaleGoldenrod	#EEE8AA	238,232,170
	Khaki	#F0E68C	240,230,140
	DarkKhaki	#BDB76B	189,183,107
	Lavender	#E6E6FA	230,230,250
	Thistle	#D8BFD8	216,191,216
	Plum	#DDA0DD	221,160,221
	Violet	#EE82EE	238,130,238
	Orchid	#DA70D6	218,112,214
	Fuchsia	#FF00FF	255,0,255
	Magenta	#FF00FF	255,0,255
	MediumOrchid	#BA55D3	186,85,211
	MediumPurple	#9370DB	147,112,219
	Amethyst	#9966CC	153,102,204
	BlueViolet	#8A2BE2	138,43,226
	DarkViolet	#9400D3	148,0,211
	DarkOrchid	#9932CC	153,50,204
	DarkMagenta	#8B008B	139,0,139
	Purple	#800080	128,0,128
	Indigo	#4B0082	75,0,130
	SlateBlue	#6A5ACD	106,90,205
	DarkSlateBlue	#483D8B	72,61,139
	GreenYellow	#ADFF2F	173,255,47
	Chartreuse	#7FFF00	127,255,0
	LawnGreen	#7CFC00	124,252,0
	Lime	#00FF00	0,255,0
	LimeGreen	#32CD32	50,205,50
	PaleGreen	#98FB98	152,251,152
	LightGreen	#90EE90	144,238,144
	MediumSpringGreen	#00FA9A	0,250,154
	SpringGreen	#00FF7F	0,255,127
	MediumSeaGreen	#3CB371	60,179,113
	SeaGreen	#2E8B57	46,139,87
	ForestGreen	#228B22	34,139,34
	Green	#008000	0,128,0
	DarkGreen	#006400	0,100,0
	YellowGreen	#9ACD32	154,205,50
	OliveDrab	#6B8E23	107,142,35
	Olive	#808000	128,128,0
	DarkOliveGreen	#556B2F	85,107,47
	MediumAquamarine	#66CDAA	102,205,170
	DarkSeaGreen	#8FBC8F	143,188,143
	LightSeaGreen	#20B2AA	32,178,170
	DarkCyan	#008B8B	0,139,139
	Teal	#008080	0,128,128
	Aqua	#00FFFF	0,255,255
	Cyan	#00FFFF	0,255,255
	LightCyan	#E0FFFF	224,255,255
	PaleTurquoise	#AFEEEE	175,238,238
	Aquamarine	#7FFFD4	127,255,212
	Turquoise	#40E0D0	64,224,208
	MediumTurquoise	#48D1CC	72,209,204
	DarkTurquoise	#00CED1	0,206,209
	CadetBlue	#5F9EA0	95,158,160
	SteelBlue	#4682B4	70,130,180
	LightSteelBlue	#B0C4DE	176,196,222
	PowderBlue	#B0E0E6	176,224,230
	LightBlue	#ADD8E6	173,216,230
	SkyBlue	#87CEEB	135,206,235
	LightSkyBlue	#87CEFA	135,206,250
	DeepSkyBlue	#00BFFF	0,191,255
	DodgerBlue	#1E90FF	30,144,255
	CornflowerBlue	#6495ED	100,149,237
	MediumSlateBlue	#7B68EE	123,104,238
	RoyalBlue	#4169E1	65,105,225
	Blue	#0000FF	0,0,255
	MediumBlue	#0000CD	0,0,205
	DarkBlue	#00008B	0,0,139
	Navy	#000080	0,0,128
	MidnightBlue	#191970	25,25,112
	Cornsilk	#FFF8DC	255,248,220
	BlanchedAlmond	#FFEBCD	255,235,205
	Bisque	#FFE4C4	255,228,196
	NavajoWhite	#FFDEAD	255,222,173
	Wheat	#F5DEB3	245,222,179
	BurlyWood	#DEB887	222,184,135
	Tan	#D2B48C	210,180,140
	RosyBrown	#BC8F8F	188,143,143
	SandyBrown	#F4A460	244,164,96
	Goldenrod	#DAA520	218,165,32
	DarkGoldenrod	#B8860B	184,134,11
	Peru	#CD853F	205,133,63
	Chocolate	#D2691E	210,105,30
	SaddleBrown	#8B4513	139,69,19
	Sienna	#A0522D	160,82,45
	Brown	#A52A2A	165,42,42
	Maroon	#800000	128,0,0
	White	#FFFFFF	255,255,255
	Snow	#FFFAFA	255,250,250
	Honeydew	#F0FFF0	240,255,240
	MintCream	#F5FFFA	245,255,250
	Azure	#F0FFFF	240,255,255
	AliceBlue	#F0F8FF	240,248,255
	GhostWhite	#F8F8FF	248,248,255
	WhiteSmoke	#F5F5F5	245,245,245
	Seashell	#FFF5EE	255,245,238
	Beige	#F5F5DC	245,245,220
	OldLace	#FDF5E6	253,245,230
	FloralWhite	#FFFAF0	255,250,240
	Ivory	#FFFFF0	255,255,240
	AntiqueWhite	#FAEBD7	250,235,215
	Linen	#FAF0E6	250,240,230
	LavenderBlush	#FFF0F5	255,240,245
	MistyRose	#FFE4E1	255,228,225
	Gainsboro	#DCDCDC	220,220,220
	LightGrey	#D3D3D3	211,211,211
	Silver	#C0C0C0	192,192,192
	DarkGray	#A9A9A9	169,169,169
	Gray	#808080	128,128,128
	DimGray	#696969	105,105,105
	LightSlateGray	#778899	119,136,153
	SlateGray	#708090	112,128,144
	DarkSlateGray	#2F4F4F	47,79,79
	Black	#000000	0,0,0
	紺色(こんいろ)	#233B6C	35,59,108
	藍色(あいいろ)	#165E83	22,94,131
	紫紺(しこん)	#411445	65,20,69
	桔梗色(ききょういろ)	#6A4C9C	106,76,156
	江戸紫(えどむらさき)	#745399	116,83,153
	鶯色(うぐいすいろ)	#918D40	145,141,64
	灰汁色(あくいろ)	#BCB09C	188,176,156
	亜麻色(あまいろ)	#D6C6AF	214,198,175
	山吹色(やまぶきいろ)	#F8B400	248,180,0
	小豆色(あずきいろ)	#98514B	152,81,75
	えんじ色	#B3424A	179.66,74
	茜色(あかねいろ)	#B13546	177,53,70
	真紅(しんく)	#B1063A	177.6,58

rrggbbは、赤(red)、緑(green)、青(blue)の値をそれぞれ00からffの16進数で2桁ずつで表します。
rgb(n,n,n)は、赤(red)、緑(green)、青(blue)の値をそれぞれ10進数で表します。
以下はMDNのCSSのcolorのリンクです。
https://developer.mozilla.org/ja/docs/Web/CSS/color_value

RGBの色をスライダーで作成する

スライダーを動かすか、数値を入力すると色が作成されます。

R 0 255

G 0 255

B 0 255

RGBの色(51,255,105)　16進数のRGBの色(#33FF69)

16進数のRGBの色をカラーピッカーで指定/確認する

・左側のカーソルを動かすと、右側の色が変わり16進数のRGB(#rrggbbの形式)を表示します。
・右側に16進数のRGB(#rrggbbの形式)を入力すると左側と右側に色が表示されます。

・16進数のRGBを入力して変換ボタンを押すとRGBの値が表示されます。

16進数のRGB ：   → RGBの色 :

カラーコードの使用例

カラーコードの使用例です。背景色をIndianRedにします。

<style>
  .p1 {
    background: IndianRed;
  }
  .p2 {
    background: #cd5c5c;
  }
  .p3 {
    background: rgb(205, 92, 92);
  }
</style>
<p class="p1">ABC</p>
<p class="p2">DEF</p>
<p class="p3">GHI</p>

3行目は、色名(IndianRed)を指定しています。
6行目は、rrggbbで指定しています。IndianRedの色になります。
9行目は、rgb(n,n,n)で指定しています。IndianRedの色になります。

色に透明度を付ける

色に透明度を付ける場合は、rgbaを指定して4つめの引数を追加します。
4つめの引数は、0から1までを指定でき0が透明で1が不透明です。

<style>
  .p1 {
    background: rgba(205, 92, 92, 0.3);
  }
</style>
<p class="p1">ABC</p>

透明度に0.3にしています。

関連の記事

ブラウザのウィンドウサイズと色深度を表示するツールするWebツール