画像透過エディター

画像透過エディターは、任意の画像から背景を除去し、特定の色を透明にできる 無料のブラウザベースツールです。簡易クロマキーのように機能し、画像をクリックして ターゲット色を選択し、許容レベルを設定すると、その色範囲内のすべてのピクセルが 完全に透明になります。

内部ではHTML5 Canvas APIのgetImageData()メソッドを使用して生のピクセルデータに アクセスしています。各ピクセルに対して、ピクセルの色とターゲット色の間のRGB色空間 におけるユークリッド距離を計算します。sqrt((r1-r2)^2 + (g1-g2)^2 + (b1-b2)^2) の式を使い、その距離が許容値スライダーで決定される閾値を下回ると、そのピクセルの アルファチャンネルがゼロに設定され、透明になります。このアプローチは許容値を 上げることでグラデーションや影にもうまく対応でき、ターゲット色に近い色合いが 含まれるようになります。

キャンバス上の画像の背後にはチェッカーボードパターンが描画されるため、どの領域が 透明になったかを明確に確認できます。オリジナルと結果が並んで表示され、リアルタイムで ビフォーアフターを比較できます。出力は常にPNGファイルです。PNGが完全なアルファ 透過をサポートする唯一の広くサポートされた画像フォーマットだからです。

すべての処理は完全にブラウザ内で行われます。画像がサーバーにアップロード されることはなく、デバイスからデータが外部に出ることも、サードパーティスクリプトが 関与することもありません。一度読み込めばオフラインでも動作します。

画像から個々の色の値を抽出したい場合は、画像カラーピッカー をお試しください。明るさ、コントラスト、彩度の調整には 画像明るさ・コントラストツールをご利用ください。 HEX、RGB、HSLなどの色フォーマット変換にはカラーコンバーター をご覧ください。

1. アップロードエリアをクリックするかファイルをドラッグ＆ドロップして画像をアップロードします。JPEG、PNG、WebP（最大50 MB）に対応しています。
2. オリジナル画像をクリックしてターゲット色を選択します。色スウォッチとHEX値が下のコントロールパネルに表示されます。
3. 許容値スライダー（0-100%）を調整して、ピクセルの色がターゲットとどの程度似ていれば透明にするかを制御します。0%は完全一致のみ、高い値は類似色を含みます。
4. Apply Transparency をクリックして画像を処理します。結果が右側にチェッカーボード背景付きで表示され、透明な領域が示されます。
5. オリジナルと結果を並べて比較します。結果が不満足な場合は、許容値を調整して再度Applyをクリックしてください。
6. Download PNG をクリックして完全な透過付きの結果を保存します。アルファチャンネルをサポートする唯一のフォーマットであるため、常にPNGでエクスポートされます。
7. Reset ですべてをクリアして最初からやり直すか、New Image で設定を保持したまま別のファイルをアップロードできます。