【CSS】色の透明度の指定（3パターン）：opacity、RGBA、HEX(16進数)

CSSで色の透明度の指定は3パターンあります。
opacityとRGBAが有名ですが、その他にも通常のHEX(16進数)でも指定できます。

/* opacity */
.colorA{
    background-color: #000; /* rgb(0,0,0);も可 */
    opacity: 0.8;
}

/* RGBA */
.colorB{
    background-color: rgba(0,0,0,0.8);
}

/* HEX(16進数) */
.colorC{
    background-color: #000000CC;
}

opacityは背景色だけでなく指定セレクタ内に文字など他の要素があると、全て透明になってしまうので注意が必要です。

HEX(16進数)はよく使われる6桁#000000の末尾に透明度を16進数を2桁追加する8桁にする#000000CCという色指定なので、便利な一方、透明度を16進数で指定しなければならないため扱いにクセがあります。

透明度5%刻みの場合の16進数は以下のようになります。

参考：https://toriton.link/coding/opacity_colorcode/
https://totolog34.com/444/