透明度
カラー透明度計算ツール - RGBA と HEX アルファ
不透明度のパーセントを RGBA、HSLA、8 桁 HEX のアルファ値に変換。白・黒・任意の背景の上での見え方をリアルタイムでプレビューできます。
60%
カラー形式
使い方
ベースカラーと透明度を選ぶと、白・黒・任意の背景に合成した実際の色を確認できます。オーバーレイ、無効状態の UI、ガラス効果、影、透明な CSS トークンに。
- 1 ベースカラーを入力します。
- 2 不透明度を 0%〜100% で設定します。
- 3 RGBA、HSLA、8 桁 HEX をコピーします。
よくある質問
8 桁 HEX のどこにアルファが入りますか？
RGB の 6 桁のあとの、最後の 2 桁がアルファです。
背景によって透明な色の見え方が変わるのはなぜ？
見える色は、アルファに応じて前景と背景のチャンネルが合成された結果だからです。
不透明度 50% の HEX アルファは？
50% はおよそ 80 です。#00000080 は約 50% の黒になります。
HEX アルファではなく RGBA を使うべきときは？
不透明度が保守上重要な場合は RGBA の方が読みやすく、ひとつの CSS カラートークンにまとめたい場合は HEX アルファがコンパクトです。