基本色RGBカラー値(Basic color keywords)

基本色(16色)のリストです。色の名前は、大文字と小文字を区別しません。

色名16進数10進数
black#0000000,0,0
gray#808080128,128,128
maroon#800000128,0,0
purple#800080128,0,128
green#0080000,128,0
olive#808000128,128,0
navy#0000800,0,128
teal#0080800,128,128
色名16進数10進数
silver#C0C0C0192,192,192
white#FFFFFF255,255,255
red#FF0000255,0,0
fuchsia#FF00FF255,0,255
lime#00FF000,255,0
yellow#FFFF00255,255,0
blue#0000FF0,0,255
aqua#00FFFF0,255,255

※ CSS2.1 では orange が追加されました。

orange#ffa500255,165,0

example

body {color: black; background: white; }
h1 { color: maroon; }
h2 { color: olive; }

上に戻る

RGB color values(RGB カラー値)

RGBカラーモデルは、数値による色指定に使用されます。次の例はすべて同じ色を指定しています。

example

em { color: #f00; }              /* #rgb */
em { color: #ff0000; }           /* #rrggbb */
em { color: rgb(255,0,0); }
em { color: rgb(100%, 0%, 0%); }

16進数でのRGBの指定は、" # " のすぐ後に、3桁か6桁の16進数( 0~9、a~f )で指定します。

3桁のRGB表記( #rgb ) は、" # " のすぐ後に、r (赤) g (緑) b (青) それぞれの値を16進数( 0~9、a~f )で指定します。 また、それぞれの値を複製することによって6桁の表記( #rrggbb ) に変換されます。たとえば、#fb0 は #ffbb00 になります。

6桁のRGB表記( #rrggbb ) は、" # " のすぐ後に、r (赤) g (緑) b (青) それぞれの値を16進数( 0~9、a~f )で2桁ずつ指定します。 それぞれの値が同じ場合には、3桁表記( #rgb ) で省略することもできます。たとえば、#ffffff (白)の場合は、#fff に省略できます。

関数表記のRGB値の形式は、" rgb( " のすぐ後に、カンマで区切って3つの数値を指定し、" ) " で閉じます。 ※ 3つの数値は、3つの整数値( 0~255, 0~255, 0~255 )、または、3つのパーセント値( 0%~100%, 0%~100%, 0%~100% )になります。 整数値 255 は 100% と16進数値の f または ff と同じですので、rgb(255,255,255) = rgb(100%,100%,100%) = #fff のようになります。 ※ 数値の前後には空白スペースを入れることもできます。

三角矢印16進数色見本はこちら

上に戻る