🪄 画像背景透過ツール
白背景や単色背景の画像を、透過 PNG に変換します。背景色をクリックで指定し、許容色幅とエッジスムージングを調整。Canvas API でブラウザ内処理。
🔒 プライバシーについて
- ・すべての処理はあなたのブラウザ内で完結します (Canvas API)
- ・画像データは一切サーバーに送信されません
- ・保存ログ・アップロード履歴・データベース等は存在しません
- ・登録・ログイン・課金は一切不要です
画像をドラッグ＆ドロップ、またはクリックで選択（ペースト可）
💡 左の元画像をクリックして背景色を指定 → 右に透過プレビューが表示されます
📖 つまずきやすいポイント
画像の背景色をクリックで指定すると、その色に近い画素を透明にして透過 PNG を書き出します。許容色幅とエッジスムージングを調整でき、処理は Canvas API でブラウザ内完結です。判定しているのは「色が近いかどうか」だけで、被写体と背景を区別しているわけではありません — したがって被写体の中に背景と同じ色があれば、そこも一緒に消えます。この仕組みが、以下すべての限界の原因です。
| ケース | 何が起きるか | どうする |
|---|---|---|
| 髪や毛の境界がギザギザになる | 色キーは1 画素ごとに「透明か不透明か」を決めます — つまり中間の半透明を作れません。ところが実際の画像では、髪の毛 1 本は 1 画素より細く、輪郭の画素は背景と被写体の色が混ざった中間色になっています。この中間色はどちらに倒しても不自然で、透明にすれば髪が消え、不透明にすれば背景の色が縁として残ります (いわゆる縁取り)。ぼけた輪郭・半透明のガラス・煙・レースなども同じ理由で扱えません — これは実装の粗さではなく、色だけで判定する方式の原理的な限界です。 | まず「エッジスムージング」を有効にしてください — 境界の画素に中間のアルファ値を与えるので、ギザギザはかなり緩和されます。ただし髪の毛や毛皮を綺麗に抜くのは、この方式では最初から無理です — そこが目的なら、機械学習ベースの背景除去 (remove.bg など) か、画像編集ソフトで手作業のマスクを作ってください。用途で判断してください — ロゴ・アイコン・図表・商品写真のように輪郭がはっきりしたものは色キーで十分ですが、人物・動物・植物は向いていません。「透過してみたら汚かった」で時間を使う前に、被写体の輪郭を見て判断してください — 拡大して境界が滑らかにぼけていたら、色キーでは無理です。 |
| 被写体の一部まで一緒に消える | 白い背景を指定すると、白いシャツ・紙・皿・目の白い部分・光の反射 (ハイライト) も同じ色なので、そこも透明になります。許容色幅を上げるほど「近い色」の範囲が広がるので、灰色がかった部分や、影の落ちた白まで巻き込みます。透過プレビューでは市松模様の上に表示されるため、白い部分が抜けたことに気付きにくい — 書き出してから白い背景のページに置いて、初めて穴が空いていることが分かるというのが典型的な流れです。 | 許容色幅を下げて、複数回に分けて処理してください — 一度で全部抜こうとせず、背景の明るい部分と暗い部分を別々にクリックするほうが、被写体を守れます。そして確認は必ず白背景と黒背景の両方で行ってください — 白い抜けは白背景では見えず、黒い抜けは黒背景では見えません。本来の解決は撮影の段階にあります — 被写体に含まれない色を背景にするのがクロマキーの原理で、映像制作で緑と青が使われるのは人間の肌と髪に緑や青がほとんど含まれないからです。商品撮影で白背景を使うなら、透過ではなく「白のまま使う」ほうが結果的にきれいです。 |
| 白いはずの背景がまだらに残る | 原因はJPEG の圧縮ノイズです。JPEG は色の情報を間引いて保存するので、画面上は「真っ白」に見えても、実際の画素値は 248 から 255 の範囲でばらついています。とくに被写体の輪郭の周りは圧縮の影響が大きく、リンギングと呼ばれる波紋状のノイズが出ます — ここが背景色から少し外れるため、輪郭に沿って背景が帯状に残るという特徴的な症状になります。スクリーンショットやスキャン画像でも、JPEG で保存されていれば同じことが起きます。 | まず許容色幅を少し上げてみてください — 圧縮ノイズによるばらつきは通常 10 前後なので、それを吸収できる程度で十分です。それでも輪郭に帯が残るなら、透過後にトリミングするか、輪郭を少し内側に削るという対処になります。より根本的には、元の画像を PNG で用意してください — PNG は可逆圧縮なので、白は正確に 255 のままです。スクリーンショットはPNG で保存する設定にしておくと、この問題自体が起きません。ロゴやアイコンなら、元データ (SVG や AI ファイル) から透過 PNG として書き出し直すのが最善です — 一度 JPEG になった画像から情報を取り戻すことはできません。 |
透過した画像は必ず PNG か WebP で保存してください — JPEG には透明度を保持する仕組みがありませんので、せっかく抜いた背景が白か黒で塗りつぶされます。用途ごとの選び方としては — Web なら PNG (互換性) か WebP (軽さ)、印刷なら透過よりも「使う背景色を指定して塗り込む」ほうが安全です (印刷会社によって透過の扱いが違い、意図しない色で合成されることがあります)。SNS のプロフィール画像やアイコンは、多くのサービスが透過を無視して白または黒の背景で合成します — 白いロゴを透過 PNG で登録すると、白背景に合成されて消えることがあるので、実際にアップロードして確認してください。容量にも注意が必要で、写真を透過 PNG にすると、同じ絵の JPEG の数倍のサイズになります — 透過が本当に必要かどうかを、まず確かめてください。
📖 使い方
-
1
画像を読み込むドラッグ＆ドロップ、ファイル選択、または Ctrl+V でクリップボードから貼り付け。
-
2
背景色を指定左の元画像の背景部分をクリックすると、その RGB が背景色として登録されます。カラーピッカーから手入力も可能。
-
3
許容色幅とエッジを調整許容色幅を上げると似た色も透過。エッジスムージングを ON にすると境界が滑らかになります。
-
4
透過 PNG をダウンロードPNG（アルファチャンネル付き）でダウンロード。元のファイル名 + _transparent が付きます。
❓ よくある質問
画像はサーバーにアップロードされますか？
複雑な背景（写真など）も透過できますか？
対応している画像形式は？
🔗 関連ツール
🐛 このツールで問題が発生しましたか？
完全無料・登録不要。再現手順だけでも結構です。届いたご報告は運営者に直接届き、修正の参考にします。
ご報告ありがとうございます！
運営者に届きました。改善の参考にさせていただきます。