アルファチャンネル

アルファチャンネル (Alpha Channel) は、画像の各ピクセルに対して透明度 (不透明度) の情報を格納する追加のデータチャンネルである。RGB の 3 チャンネルに加えて 4 番目のチャンネルとして存在し、RGBA カラーモデルの A に相当する。1984 年に Porter と Duff が発表したアルファ合成の論文で理論的基盤が確立された。

アルファ値は通常 0 から 255 (8 ビット) の範囲で表現される。PNG では 16 ビット (0 から 65535) の精度も選べ、CSS の rgba() では 0 から 1 の小数 (百分率での指定も可) で指定する。以下は 8 ビットの場合である。

• 0: 完全に透明。背景がそのまま見える
• 255: 完全に不透明。ピクセルの色がそのまま表示される
• 1-254: 半透明。アルファ合成により背景色とブレンドされる

対応する主要な画像形式は以下のとおりである。

• PNG: 8 ビットまたは 16 ビットのアルファに対応 (ストレートアルファで格納)。Web の透過画像で広く使われる
• WebP: 非可逆・可逆の両モードで透過サポート
• AVIF: 高圧縮率と透過を両立
• TIFF: 複数アルファチャンネル格納可能。印刷ワークフロー向け
• GIF: パレット内の 1 色を透明色として指定する 2 値の透過のみで、半透明は表現できない

JPEG はアルファ非対応のため、透過が必要な場合は PNG、WebP、AVIF を選択する。透過画像を JPEG に変換すると透明だった部分は背景色で塗り潰される (フラット化) ため、変換前に背景色を決めておく必要がある。

実務での落とし穴は格納方式の違いである。色値をそのまま持つストレートアルファ (非乗算) と、色値にあらかじめアルファを掛けておく乗算済みアルファ (premultiplied alpha) の 2 系統があり、PNG は前者で格納する。方式を取り違えて合成すると、半透明の縁が不自然に暗くなったり明るい縁取りが出たりする。

Web 開発ではロゴの背景透過、UI オーバーレイ、画像合成に不可欠である。CSS の opacity が要素全体を一律制御するのに対し、アルファチャンネルはピクセル単位で透明度を指定でき、複雑な形状の切り抜きや滑らかなアンチエイリアシングを実現する。