Web デザインで色を表現するにはいくつかの方法があります。

HEX は、16 進数に基づく 16 進数の色表現システムです。このシステムでは、0 ～ 9 のアラビア 10 進数字と A ～ F のラテン文字が使用され、デジタル数値を 16 に補います。Web デザインの場合、16 原色 (キー)いわゆる 16 進カラー コード #RRGGBB が使用され、各ペアが色の分担を担当します: RR – 赤、GG – 緑、BB – 青。 各色分数の範囲は 00 から FF です。

Web デザインにおける色の表現には他に 2 つあります。RGB(*,*,*) の形式で、色の各「*」部分は 0 ～ 255 の 10 進数と英語の色名で表されます。

カラー画像を作成する場合、主な問題は、さまざまな種類のコンピューター、モニター、ブラウザーで色を正しく再現できるかどうかです。 ブラウザが色を正しく表示できない場合は、似た色を選択するか、複数の色を混ぜて表示します。 そして場合によっては、まったく別の色に置き換えられることもあります。

テーブル 16原色、すべてのブラウザで使用されます

名前	色	16進数	(RGB)
アクア（海の波）		#00FFFF	(000,255,255)
黒		#000000	(000,000,000)
青		#0000FF	(000,000,255)
フクシア（マゼンタ）		#FF00FF	(255,000,255)
グレー		#808080	(128,128,128)
緑		#008000	(000,128,000)
ライム（明るい緑）		#00FF00	(000,255,000)
マルーン（濃いワインレッド）		#800000	(128,000,000)
ネイビー(紺)		#000080	(000,000,128)
オリーブ		#808000	(128,128,000)
紫		#800080	(128,000,128)
赤		#FF0000	(255,000,000)
銀		#C0C0C0	(192,192,192)
ティール（灰緑色）		#008080	(000,128,128)
白		#FFFFFF	(255,255,255)
黄色		#FFFF00	(255,255,000)

テーブル 紫色とその色合い

名前	色	16進数	(RGB)
マゼンタ（マゼンタ）		#FFCBDB	(255,203,219)
マゼンタ（マゼンタ）		#FF0099	(255,000,153)
マゼンタ（マゼンタ）		#F95A61	(249,090,097)
フクシア（フクシア）		#FF00FF	(255,000,255)
モーヴァン（アニリンパープル）		#EF0097	(239,000,151)
サーモンピンク（オレンジピンク）		#FF91A4	(255,145,164)
セニース（紫の色合い）		#DE3163	(153,149,140)
茄子（なす）		#990066	(153,000,132)
ラベンダーブラッシュ（ピンクがかったラベンダー）		#FFF0F5	(255,240,245)
ライラック（ライラック）		#C8A2C8	(200,162,200)
マゼンタ（マゼンタ）		#FF008F	(255,000,143)
オーキッド（蘭）		#DA70D6	(218,112,214)
赤紫（赤紫）		#C71585	(199,021,133)
楽観的（楽観的）		#92000A	(146,000,010)
アザミ（紫の色合い）		#D8BFD8	(185,211,238)
バイオレットナス（紫の色合い）		#991199	(153,017,153)
Rosa vivo（ディープピンク）		#FF007F	(255,000,127)
ラベンダーローズ（紫の色合い）		#FBA0E3	(108,123,139)
マウントバッテン ピンク		#997ABD	(153,122,141)

テーブル グレー色とその色合い

名前	色	16進数	(RGB)
グレー		#808080	(128,128,128)
グレー		#ベベベ	(190,190,190)
(グレー系)		#858585	(133,133,133)
グレー33		#545454	(084,084,084)
(灰色のスレート)		#708090	(112,128,144)
（石英）		#99958с	(153,149,140)
(ライトグレー)		#bbbbbb	(187,187,187)
（銀）		#c0c0c0	(192,192,192)
(灰白色)		#f0f0f0	(240,240,240)
(アブデル＝ケリムのひげ)		#e0e0e0	(224,224,224)
ライトグレー(ライトグレー)		#d3d3d3	(211,211,211)
LightStateGray()		#778899	(119,136,153)
StateGray-1 (ペールコーンフラワーブルー1)		#c6e2ff	(198,226,255)
StateGray-2 (ペールコーンフラワーブルー2)		#b9d3ee	(185,211,238)
StateGray3()		#9fb6cd	(159,182,205)
StateGray4()		#6c7b8b	(108,123,139)

このページには、HTML、CSS、JavaScript、Flash などの Web 開発言語で色を指定するために使用できるキーワードの表が含まれています。

WC3 に関する古い仕様では、HTML と CSS で設定される色を利用して、16 個のキーワードのみが指定されていました。 さらに最新の仕様では、色の名前を示すためにさらに 130 個のキーワードが追加されました。 次の表には、色の名前と、それらに対応する 16 進コードおよび RGB コードが含まれています。

CSS ルールに従って、色の名前は大文字と小文字が区別されません。 カラーエントリ IndianRed と indianred は同等です。

また、表内の 146 個のキーワードのうち、実際に含まれる色の数が少ないことにも注目してください。 これは、一部のキーワードが同じ色を参照しているためです。 したがって、Gray と Gray という名前は 50% グレーのカラー コード #808080 を表し、Magenta という単語は HTML カラーの Fuchsia の同義語であり、16 進コード #FF00FF に対応します。 また、Aqua と Cyan という単語も同義で、コード #00FFFF に対応します。

HTMLとCSSでの色の名前 16進数 RGB 赤のトーン: インド人赤 #CD5C5C 205, 92, 92 ライトコーラル #F08080 240, 128, 128 鮭 #FA8072 250, 128, 114 ダークサーモン #E9967A 233, 150, 122 ライトサーモン #FFA07A 255, 160, 122 クリムゾン #DC143C 220, 20, 60 赤 #FF0000 255, 0, 0 耐火レンガ #B22222 178, 34, 34 ダークレッド #8B0000 139, 0, 0 ピンクのトーン: ピンク #FFC0CB 255, 192, 203 ライトピンク #FFB6C1 255, 182, 193 ホットピンク #FF69B4 255, 105, 180 ディープピンク #FF1493 255, 20, 147 中紫赤 #C71585 199, 21, 133 淡い紫赤 #DB7093 219, 112, 147 オレンジのトーン: ライトサーモン #FFA07A 255, 160, 122 コーラル #FF7F50 255, 127, 80 トマト #FF6347 255, 99, 71 オレンジ赤 #FF4500 255, 69, 0 ダークオレンジ #FF8C00 255, 140, 0 オレンジ #FFA500 255, 165, 0 黄色のトーン: 金 #FFD700 255, 215, 0 黄色 #FFFF00 255, 255, 0 ライトイエロー #FFFFE0 255, 255, 224 レモンシフォン #FFFACD 255, 250, 205 光ゴールデンロッド黄色 #FAFAD2 250, 250, 210 パパイヤホイップ #FFEFD5 255, 239, 213 モカシン #FFE4B5 255, 228, 181 ピーチパフ #FFDAB9 255, 218, 185 セイタカアワダチソウ #EEE8AA 238, 232, 170 カーキ #F0E68C 240, 230, 140 ダークカーキ #BDB76B 189, 183, 107 バイオレットトーン: ラベンダー #E6E6FA 230, 230, 250 アザミ #D8BFD8 216, 191, 216 梅 #DDA0DD 221, 160, 221 バイオレット #EE82EE 238, 130, 238 蘭 #DA70D6 218, 112, 214 フクシア #FF00FF 255, 0, 255 マゼンタ #FF00FF 255, 0, 255 中蘭 #BA55D3 186, 85, 211 ミディアムパープル #9370DB 147, 112, 219 ブルーバイオレット #8A2BE2 138, 43, 226 ダークバイオレット #9400D3 148, 0, 211 ダークオーキッド #9932CC 153, 50, 204 ダークマゼンタ #8B008B 139, 0, 139 紫 #800080 128, 0, 128 インジゴ #4B0082 75, 0, 130 スレートブルー #6A5ACD 106, 90, 205 ダークスレートブルー #483D8B 72, 61, 139 ブラウントーン: コーンシルク #FFF8DC 255, 248, 220 湯通しアーモンド #FFEBCD 255, 235, 205 ビスク #FFE4C4 255, 228, 196 ナバホ族白 #FFDEAD 255, 222, 173 小麦 #F5DEB3 245, 222, 179 バーリーウッド #DEB887 222, 184, 135 タン #D2B48C 210, 180, 140 ロージーブラウン #BC8F8F 188, 143, 143 サンディブラウン #F4A460 244, 164, 96 アキノキリンソウ #DAA520 218, 165, 32 ダークゴールデンロッド #B8860B 184, 134, 11 ペルー #CD853F 205, 133, 63 チョコレート #D2691E 210, 105, 30 サドルブラウン #8B4513 139, 69, 19 シエナ #A0522D 160, 82, 45 茶色 #A52A2A 165, 42, 42 マルーン #800000 128, 0, 0 原色: 黒 #000000 0, 0, 0 グレー #808080 128, 128, 128 銀 #C0C0C0 192, 192, 192 白 #FFFFFF 255, 255, 255 フクシア #FF00FF 255, 0, 255 紫 #800080 128, 0, 128 赤 #FF0000 255, 0, 0 マルーン #800000 128, 0, 0 黄色 #FFFF00 205, 92, 92 オリーブ #808000 240, 128, 128 ライム #00FF00 250, 128, 114 緑 #008000 233, 150, 122 アクア #00FFFF 205, 92, 92 ティール #008080 240, 128, 128 青 #0000FF 250, 128, 114 海軍 #000080 233, 150, 122

HTMLとCSSでの色の名前 16進数 RGB 緑のトーン: 緑黄 #ADFF2F 173, 255, 47 シャルトルーズ #7FFF00 127, 255, 0 芝生緑 #7CFC00 124, 252, 0 ライム #00FF00 0, 255, 0 ライムグリーン #32CD32 50, 205, 50 ペールグリーン #98FB98 152, 251, 152 ライトグリーン #90EE90 144, 238, 144 ミディアムスプリンググリーン #00FA9A 0, 250, 154 スプリンググリーン #00FF7F 0, 255, 127 中海緑 #3CB371 60, 179, 113 シーグリーン #2E8B57 46, 139, 87 森林緑 #228B22 34, 139, 34 緑 #008000 0, 128, 0 ダークグリーン #006400 0, 100, 0 黄緑 #9ACD32 154, 205, 50 オリーブドラブ #6B8E23 107, 142, 35 オリーブ #808000 128, 128, 0 ダークオリーブグリーン #556B2F 85, 107, 47 ミディアムアクアマリン #66CDAA 102, 205, 170 ダークシーグリーン #8FBC8F 143, 188, 143 光海緑 #20B2AA 32, 178, 170 ダークシアン #008B8B 0, 139, 139 ティール #008080 0, 128, 128 ブルートーン: アクア #00FFFF 0, 255, 255 シアン #00FFFF 0, 255, 255 ライトシアン #E0FFFF 224, 255, 255 ペールターコイズ #アフィーイー 175, 238, 238 アクアマリン #7FFFD4 127, 255, 212 ターコイズ #40E0D0 64, 224, 208 ミディアムターコイズ #48D1CC 72, 209, 204 ダークターコイズ #00CED1 0, 206, 209 カデットブルー #5F9EA0 95, 158, 160 スティールブルー #4682B4 70, 130, 180 ライトスチールブルー #B0C4DE 176, 196, 222 パウダーブルー #B0E0E6 176, 224, 230 ライトブルー #ADD8E6 173, 216, 230 スカイブルー #87CEEB 135, 206, 235 ライトスカイブルー #87CEFA 135, 206, 250 ディープスカイブルー #00BFFF 0, 191, 255 ドジャーブルー #1E90FF 30, 144, 255 ヤグルマギクブルー #6495ED 100, 149, 237 ミディアムスレートブルー #7B68EE 123, 104, 238 ロイヤルブルー #4169E1 65, 105, 225 青 #0000FF 0, 0, 255 ミディアムブルー #0000CD 0, 0, 205 ダークブルー #00008B 0, 0, 139 海軍 #000080 0, 0, 128 ミッドナイトブルー #191970 25, 25, 112 ホワイトトーン: 白 #FFFFFF 255, 255, 255 雪 #FFFAFA 255, 250, 250 甘露 #F0FFF0 240, 255, 240 ミントクリーム #F5FFFA 245, 255, 250 アズール #F0FFFF 240, 255, 255 アリスブルー #F0F8FF 240, 248, 255 ゴーストホワイト #F8F8FF 248, 248, 255 ホワイトスモーク #F5F5F5 245, 245, 245 貝殻 #FFF5EE 255, 245, 238 ベージュ #F5F5DC 245, 245, 220 オールドレース #FDF5E6 253, 245, 230 花柄白 #FFFAF0 255, 250, 240 象牙 #FFFFFF0 255, 255, 240 アンティークホワイト #FAEBD7 250, 235, 215 リネン #FAF0E6 250, 240, 230 ラベンダーブラッシュ #FFF0F5 255, 240, 245 ミスティローズ #FFE4E1 255, 228, 225 グレートーン: ゲインズボロ #DCDCDC 220, 220, 220 ライトグレー #D3D3D3 211, 211, 211 ライトグレー #D3D3D3 211, 211, 211 銀 #C0C0C0 192, 192, 192 ダークグレー #A9A9A9 169, 169, 169 ダークグレー #A9A9A9 169, 169, 169 グレー #808080 128, 128, 128 グレー #808080 128, 128, 128 ディムグレー #696969 105, 105, 105 ディムグレー #696969 105, 105, 105 ライトスレートグレー #778899 119, 136, 153 ライトスレートグレー #778899 119, 136, 153 スレートグレー #708090 112, 128, 144 スレートグレー #708090 112, 128, 144 ダークスレートグレー #2F4F4F 47, 79, 79 ダークスレートグレー #2F4F4F 47, 79, 79 黒 #000000 0, 0, 0

色の指定には 16 進数が使用されます。 16 進法は、10 進法とは異なり、その名前が示すように、数字の 16 に基づいています。数字は次のようになります: 0、1、2、3、4、5、6、7、8、9、A 、B、C、D、E、F。10 から 15 までの数字はラテン文字に置き換えられます。 16 進法で 15 より大きい数値は、2 つの数値を 1 つに結合することによって形成されます。 たとえば、10 進数の 255 は 16 進数の FF に対応します。 番号体系を決定する際の混乱を避けるために、ハッシュ記号 # が 16 進数の前に置かれます (例: #666999)。 赤、緑、青の 3 色はそれぞれ、00 から FF までの値を取ることができます。 したがって、カラー シンボルは 3 つのコンポーネント #rrggbb に分割されます。最初の 2 つのシンボルは色の赤コンポーネントを示し、中央の 2 つは緑、最後の 2 つは青を示します。 省略形 #rgb を使用することが許可されており、各文字は 2 倍になります。 したがって、エントリ #fe0 は #ffee00 と見なされます。

名前で

インターネットエクスプローラー	クロム	オペラ	サファリ	Firefox	アンドロイド	iOS
4.0+	1.0+	3.5+	1.3+	1.0+	1.0+	1.0+

ブラウザは名前によって一部の色をサポートしています。 テーブル内 1 は、名前、16 進コード、RGB、HSL 値と説明を示します。

テーブル 1. 色の名前

名前	色	コード	RGB	HSL	説明
白		#ffffff または #fff	RGB(255,255,255)	hsl(0.0%,100%)	白
銀		#c0c0c0	RGB(192,192,192)	hsl(0.0%,75%)	グレー
グレー		#808080	RGB(128,128,128)	hsl(0.0%,50%)	ダークグレー
黒		#000000 または #000	RGB(0,0,0)	hsl(0.0%,0%)	黒
栗色		#800000	RGB(128,0,0)	hsl(0.100%,25%)	濃い赤
赤		#ff0000 または #f00	RGB(255,0,0)	hsl(0,100%,50%)	赤
オレンジ		#ffa500	rgb(255,165,0)	hsl(38.8,100%,50%)	オレンジ
黄色		#ffff00 または #ff0	rgb(255,255,0)	hsl(60,100%,50%)	黄色
オリーブ		#808000	rgb(128,128,0)	hsl(60,100%,25%)	オリーブ
ライム		#00ff00 または #0f0	RGB(0,255,0)	hsl(120,100%,50%)	ライトグリーン
緑		#008000	RGB(0,128,0)	hsl(120,100%,25%)	緑
アクア		#00ffff または #0ff	RGB(0,255,255)	hsl(180,100%,50%)	青
青		#0000ff または #00f	RGB(0,0,255)	hsl(240,100%,50%)	青
海軍		#000080	RGB(0,0,128)	hsl(240,100%,25%)	ダークブルー
ティール		#008080	RGB(0,128,128)	hsl(180,100%,25%)	青緑
フクシア		#ff00ff または #f0f	RGB(255,0,255)	hsl(300,100%,50%)	ピンク
紫		#800080	RGB(128,0,128)	hsl(300,100%,25%)	バイオレット

RGBの使用

インターネットエクスプローラー	クロム	オペラ	サファリ	Firefox	アンドロイド	iOS
5.0+	1.0+	3.5+	1.3+	1.0+	1.0+	1.0+

赤、緑、青の値を 10 進数で使用して色を定義できます。 3 つの色成分はそれぞれ 0 ～ 255 の値をとります。色をパーセンテージで指定することもできます。100% は数値 255 に対応します。最初に rgb キーワードを指定し、次に括弧内に色成分を指定します。 、たとえば rgb(255 , 128, 128) または rgb(100%, 50%, 50%) のようにカンマで区切ります。

RGBA

インターネットエクスプローラー	クロム	オペラ	サファリ	Firefox	アンドロイド	iOS
9.0+	1.0+	10.0+	3.1+	3.0+	2.1+	2.0+

RGBA 形式は構文が RGB に似ていますが、要素の透明度を指定するアルファ チャネルが含まれています。 値 0 は完全に透明、1 は不透明、0.5 などの中間値は半透明です。

RGBA は CSS3 に追加されたため、CSS コードはこのバージョンに対して検証する必要があります。 CSS3 標準はまだ開発中であり、一部の機能は変更される可能性があることに注意してください。 たとえば、background-color プロパティに追加された RGB 形式の色は検証されますが、background プロパティに追加された色は無効になります。 同時に、ブラウザは両方のプロパティの色を正確に理解します。

HSL

インターネットエクスプローラー	クロム	オペラ	サファリ	Firefox	アンドロイド	iOS
9.0+	1.0+	9.6+	3.1+	3.0+	2.1+	2.0+

HSL 形式の名前は、Hue (色相)、Saturate (彩度)、Lightness (明度) の最初の文字の組み合わせに由来しています。 色相はカラー ホイール (図 1) 上の色の値であり、度で表されます。 0°は赤、120°は緑、240°は青に対応します。 色相の値は 0 ～ 359 の範囲で変化します。

米。 1. カラーホイール

彩度は色の強度であり、0% から 100% までのパーセンテージとして測定されます。 値 0% は色がなくグレーの色合いを示し、100% は彩度の最大値です。

明度は色の明るさを指定し、0% ～ 100% のパーセンテージで指定します。 低い値は色を暗くし、高い値は色を明るくします。0% と 100% の極端な値は白と黒に対応します。

HSLA

インターネットエクスプローラー	クロム	オペラ	サファリ	Firefox	アンドロイド	iOS
9.0+	1.0+	10.0+	3.1+	3.0+	2.1+	2.0+

HSLA 形式は構文が HSL に似ていますが、要素の透明度を指定するアルファ チャネルが含まれています。 値 0 は完全に透明、1 は不透明、0.5 などの中間値は半透明です。

RGBA、HSL、HSLA のカラー値は CSS3 に追加されるため、これらの形式を使用する場合はコードのバージョンが有効であるかどうかを確認してください。

HTML5 CSS2.1 CSS3 IE Cr Op Sa Fx

警告

このサイトに掲載されているライオン捕獲方法はすべて理論的であり、計算手法に基づいています。 著者は、それらを使用する際の安全性を保証せず、結果について一切の責任を負いません。 ライオンは捕食者であり、危険な動物であることを忘れないでください。

この例の結果を図に示します。 2.

米。 2. Web ページの色

色のテーブル（パレット）html必要なトーンを個別に選択する機会が得られます。 カラー値は、16 進数、RGB、HSV の 3 つの形式で表示されます。

• Hex は、16 進数体系の 3 つの 2 文字の値で構成されます。 例: #ff00b3。最初の数字のペアは赤、2 番目は緑、3 番目は青です。
• RGB (RedGreenBlue) の形式は「200,100,255」で、結果の色の対応するトーン (赤、緑、青) の量を示します。
• HSV (色相、彩度、値 - トーン、彩度、値) - 座標が次のようなカラー モデルです。
  • 色相 - 色調。0° から 360° まで変化します。
  • 彩度 - 彩度は 0 ～ 100 または 0 ～ 1 の範囲で変化します。 このパラメータが高いほど色が「純粋」になるため、このパラメータは色純度と呼ばれることがあります。 このパラメータがゼロに近づくほど、色はニュートラル グレーに近づきます。
  • 値 (色の値) - 明るさを設定します。値は 0 ～ 100 または 0 ～ 1 の間で変化することもできます。

カラーコードを入力してください: 行く

名前が付いている色のリスト

この表には、すべてのブラウザでサポートされる英語の色名 (値として使用できる) とその 16 進値がリストされています。 リストされている色はすべて「安全」です。つまり、すべてのブラウザで同じように表示されます。

色の名前	16進数	色
黒	#000000
海軍	#000080
ダークブルー	#00008B
ミディアムブルー	#0000CD
青	#0000FF
ダークグリーン	#006400
緑	#008000
ティール	#008080
ダークシアン	#008B8B
ディープスカイブルー	#00BFFF
ダークターコイズ	#00CED1
ミディアムスプリンググリーン	#00FA9A
ライム	#00FF00
スプリンググリーン	#00FF7F
アクア	#00FFFF
シアン	#00FFFF
ミッドナイトブルー	#191970
ドジャーブルー	#1E90FF
光海緑	#20B2AA
森林緑	#228B22
シーグリーン	#2E8B57
ダークスレートグレー	#2F4F4F
ライムグリーン	#32CD32
中海緑	#3CB371
ターコイズ	#40E0D0
ロイヤルブルー	#4169E1
スティールブルー	#4682B4
ダークスレートブルー	#483D8B
ミディアムターコイズ	#48D1CC
インジゴ	#4B0082
ダークオリーブグリーン	#556B2F
カデットブルー	#5F9EA0
ヤグルマギクブルー	#6495ED
ミディアムアクアマリン	#66CDAA
ディムグレー	#696969
スレートブルー	#6A5ACD
オリーブドラブ	#6B8E23
スレートグレー	#708090
ライトスレートグレー	#778899
ミディアムスレートブルー	#7B68EE
芝生緑	#7CFC00
シャルトルーズ	#7FFF00
アクアマリン	#7FFFD4
マルーン	#800000
紫	#800080
オリーブ	#808000
グレー	#808080
スカイブルー	#87CEEB
ライトスカイブルー	#87CEFA
ブルーバイオレット	#8A2BE2
ダークレッド	#8B0000
ダークマゼンタ	#8B008B
サドルブラウン	#8B4513
ダークシーグリーン	#8FBC8F
ライトグリーン	#90EE90
ミディアムパープル	#9370D8
ダークバイオレット	#9400D3
ペールグリーン	#98FB98
ダークオーキッド	#9932CC
黄緑	#9ACD32
シエナ	#A0522D
茶色	#A52A2A
ダークグレー	#A9A9A9
ライトブルー	#ADD8E6
緑黄	#ADFF2F
ペールターコイズ	#アフィーイー
ライトスチールブルー	#B0C4DE
パウダーブルー	#B0E0E6
耐火レンガ	#B22222
ダークゴールデンロッド	#B8860B
中蘭	#BA55D3
ロージーブラウン	#BC8F8F
ダークカーキ	#BDB76B
銀	#C0C0C0
中紫赤	#C71585
インド人赤	#CD5C5C
ペルー	#CD853F
チョコレート	#D2691E
タン	#D2B48C
ライトグレー	#D3D3D3
淡い紫赤	#D87093
アザミ	#D8BFD8
蘭	#DA70D6
ゴールデンロッド	#DAA520
クリムゾン	#DC143C
ゲインズボロ	#DCDCDC
梅	#DDA0DD
バーリーウッド	#DEB887
ライトシアン	#E0FFFF
ラベンダー	#E6E6FA
ダークサーモン	#E9967A
バイオレット	#EE82EE
ペールゴールデンロッド	#EEE8AA
ライトコーラル	#F08080
カーキ	#F0E68C
アリスブルー	#F0F8FF
甘露	#F0FFF0
アズール	#F0FFFF
サンディブラウン	#F4A460
小麦	#F5DEB3
ベージュ	#F5F5DC
ホワイトスモーク	#F5F5F5
ミントクリーム	#F5FFFA
ゴーストホワイト	#F8F8FF
鮭	#FA8072
アンティークホワイト	#FAEBD7
リネン	#FAF0E6
ライトゴールデンロッド黄色	#FAFAD2
オールドレース	#FDF5E6
赤	#FF0000
フクシア	#FF00FF
マゼンタ	#FF00FF
ディープピンク	#FF1493
オレンジ赤	#FF4500
トマト	#FF6347
ホットピンク	#FF69B4
コーラル	#FF7F50
ダークオレンジ	#FF8C00
ライトサーモン	#FFA07A
オレンジ	#FFA500
ライトピンク	#FFB6C1
ピンク	#FFC0CB
金	#FFD700
ピーチパフ	#FFDAB9
ナバホ族白	#FFDEAD
モカシン	#FFE4B5
ビスク	#FFE4C4
ミスティローズ	#FFE4E1
湯通しアーモンド	#FFEBCD
パパイヤホイップ	#FFEFD5
ラベンダーブラッシュ	#FFF0F5
シーシェル	#FFF5EE
コーンシルク	#FFF8DC
レモンシフォン	#FFFACD
花柄白	#FFFAF0
雪	#FFFAFA
黄色	#FFFF00
ライトイエロー	#FFFFE0
象牙	#FFFFFF0
白	#FFFFFF

HTML では、次の 3 つの方法で色を指定できます。

HTML で色を名前で設定する

一部の色は、英語の色名を値として使用して、名前で指定できます。 最も一般的なキーワード: 黒、白、赤、緑、青など:

文字の色 – 赤

World Wide Web Consortium (W3C) 標準の最も人気のある色:

色	名前	色	名前	色	名前	色	名前
	黒		グレー		銀		白
	黄色		ライム		アクア		フクシア
	赤		緑		青		紫
	マルーン		オリーブ		海軍		ティール

異なる色の名前を使用する例:

例: 色を名前で指定する

• 自分で試してみる »

赤い背景のヘッダー

オレンジ色の背景のヘッダー

ライムの背景に向かって

青の背景に白の文字

赤い背景のヘッダー

オレンジ色の背景のヘッダー

ライムの背景に向かって

青の背景に白の文字

RGBを使用した色の指定

モニターにさまざまな色を表示する場合、RGB パレットが基準として使用されます。 あらゆる色は、次の 3 つの基本的な色を混合することで得られます。 R - 赤, G - グリーン, B - ブルー。 各色の明るさは 1 バイトで与えられるため、0 から 255 までの値を取ることができます。たとえば、赤が最高値 (255) に設定されているため、RGB(255,0,0) は赤として表示されます。残りは 0 に設定されます。色をパーセンテージとして設定することもできます。 各パラメータは、対応する色の明るさのレベルを示します。 例: 値 rgb(127, 255, 127) と rgb(50%, 100%, 50%) は、同じ中彩度の緑色を設定します。

例: RGB を使用した色の指定

• 自分で試してみる »

RGB(127, 255, 127)

rgb(50%、100%、50%)

RGB(127, 255, 127)

rgb(50%、100%、50%)

16進数で色を設定

価値観 R G B 16 進数 (HEX) の色の値を次の形式で指定することもできます: #RRGGBB ここで、RR (赤)、GG (緑)、BB (青) は 00 から FF までの 16 進値です (10 進数の 0 ～ 255 と同じです)。 ）。 16 進法は、10 進法とは異なり、その名前が示すように、数字の 16 に基づいています。16 進法では、0、1、2、3、4、5、6、7、8、9、 A、B、C、D、E、F。ここでは、10 から 15 までの数字がラテン文字に置き換えられています。 16 進数で 15 より大きい数値は、2 つの文字を 1 つの値に結合することで表されます。 たとえば、10 進数の最大値 255 は、16 進数の最大 FF 値に対応します。 10 進数とは異なり、16 進数の前にはハッシュ記号が付きます。 # たとえば、#FF0000 は赤として表示されます。これは、赤が最高値 (FF) に設定され、残りの色が最小値 (00) に設定されているためです。 ハッシュ記号の後の記号 # 大文字と小文字の両方を入力できます。 16 進数システムでは、#rgb という省略形を使用できます。各文字は double に相当します。 したがって、エントリ #f70 は #ff7700 と見なされます。

例: HEX カラー

• 自分で試してみる »

赤: #FF0000

緑: #00FF00

青: #0000FF

赤: #FF0000

緑: #00FF00

青: #0000FF

赤+緑=黄: #FFFF00

赤+青=紫: #FF00FF

緑+青=シアン: #00FFFF

一般的な色のリスト (名前、16 進数、RGB):

英語名	ロシアの名前	サンプル	16進数	RGB
アマランス	アマランス		#E52B50	229	43	80
アンバー	アンバー		#FFBF00	255	191	0
アクア	青緑		#00FFFF	0	255	255
アズール	アズール		#007FFF	0	127	255
黒	黒		#000000	0	0	0
青	青		#0000FF	0	0	255
ボンダイブルー	ボンダイビーチの水		#0095B6	0	149	182
真鍮	真鍮		#B5A642	181	166	66
茶色	茶色		#964B00	150	75	0
セルリアン	アズール		#007BA7	0	123	167
ダークスプリンググリーン	ダークスプリンググリーン		#177245	23	114	69
エメラルド	エメラルド		#50C878	80	200	120
ナス	ナス		#990066	153	0	102
フクシア	フクシア		#FF00FF	255	0	255
金	金		#FFD700	250	215	0
グレー	グレー		#808080	128	128	128
緑	緑		#00FF00	0	255	0
インジゴ	インジゴ		#4B0082	75	0	130
ジェイド	ジェイド		#00A86B	0	168	107
ライム	ライム		#CCFF00	204	255	0
マラカイト	マラカイト		#0BDA51	11	218	81
海軍	ダークブルー		#000080	0	0	128
黄土	黄土		#CC7722	204	119	34
オリーブ	オリーブ		#808000	128	128	0
オレンジ	オレンジ		#FFA500	255	165	0
桃	桃		#FFE5B4	255	229	180
パンプキン	パンプキン		#FF7518	255	117	24
紫	バイオレット		#800080	128	0	128
赤	赤		#FF0000	255	0	0
サフラン	サフラン		#F4C430	244	196	48
シーグリーン	緑の海		#2E8B57	46	139	87
スワンプグリーン	ボロトニー		#ACB78E	172	183	142
ティール	青緑		#008080	0	128	128
ウルトラマリン	ウルトラマリン		#120A8F	18	10	143
バイオレット	バイオレット		#8B00FF	139	0	255
黄色	黄色		#FFFF00	255	255	0

彩度と色相によって（背景）を色分けします。