CSSで16進色を使用する方法

16進色の使用方法を学ぶ （CSSでは「16進色」とも呼ばれます。

16進表記（または16進表記）は、RGBカラーを表現するための代替方法です。

16進色表記は、3つのブロックで指定され、それぞれに2つの値があります。

• RR
• GG
• BB

一緒にそれらは#RRGGBBになります。

ギリシャ語では、ヘキサは6を意味し、ご覧のとおり、RRGGBBの合計は6です。

16進色がRGBと異なる点は、16進色が0から255までの値を2桁で表現することです。

たとえば、以下の100％白のRGBカラー：

rgb(255,255,255);

次のように16進色で表現できます：

#ffffff /* 100% white */

さらに一歩進んで、2桁が等しい場合は2桁を1に短縮できます（FF FF FFなど）：

#fff /* shortcut for 100% white */

アルファチャネルを使用した16進数

RGBにRGBaがあり、HSLにHSLaがあるのと同じように、Hexにも2桁のブロックを追加して表現されるAlphaチャネルがあるため、16進数の色表記は #RRGGBB #RRGGBBAAになります （アルファの場合はA）。

たとえば、次の16進色は100％黒で、不透明度は25％です（75 ）：

#00000075 /* Black with 25% opacity */

結果：

ところで：大文字または小文字を使用して16進色表記を書くことができます。 #ffffffと#FFFFFFのどちらを書いても違いはありません。

16進表記のブラウザサポート

• #RRGGBB 16進色表記は、レガシーブラウザを含むすべてのブラウザでサポートされています。
• #RRGGBBAA 16進色表記は、すべての最新のブラウザで機能しますが、IE11では機能しません（最新を誰かが考えている場合） 。