Photoshopで一生懸命背景を切り抜いたのに
・保存したら背景が白くなってしまった…
・透明なまま書き出す形式がわからない…
・設定が複雑でどこを触ればいいか不安…
と困っている方は安心してください。
Photoshopで背景透過を維持するには「PNG形式」を選んで保存するだけで解決します。
JPEGなどの形式は透明情報を保持できないため、自動的に白く塗りつぶされてしまいますが、PNGなら透明な部分はそのまま透明として保存されるからです。
この記事では
- 背景透過を維持できる正しい保存形式「PNG」の選び方
- 書き出し画面でチェックすべき「透明部分」の設定
- 背景レイヤーのロック解除など、失敗しないための基本操作
を丁寧に解説するので、せっかく作った画像が台無しになることはありません。
ちなみに、解決方法はとてもシンプルで
- 保存時にファイル形式を「PNG」にする
- Web用に保存画面で「透明部分」にチェックを入れる
という2点さえ押さえれば大丈夫です。
これなら「また失敗するかも…」と不安だった方でも、自信を持って画像を書き出せます。
なので、透明な画像を正しく保存することは全く難しくないので安心してくださいね。
アドビ公式サイト
👉 今の年収、適正かLINEで相談してみる
その年収…普通に損してるかもしれません
「デザイナーは給料が低い…」
それ、本当にあなたの実力のせいですか？
デザインスキルを正しく評価してくれる会社は
実在します。ただし…
知っている人だけが辿り着けます。
LINEで無料相談できる
クリエイター専門転職エージェント
＼自分の市場価値を今すぐ確認する／
- 背景透過を維持するために選ぶべき正しいファイル形式
- 書き出し時に画像の背景が白くなってしまう原因と対策
- 透明情報を保持するためのチェック項目と設定手順
- 画質を確認しながら安全に保存できるWeb用に保存の使い方
Photoshopで背景透過した画像を正しく書き出しするにはPNG形式を選べば安心です
まずは、せっかく背景を切り抜いた画像が、保存した瞬間に白くなってしまう問題を解決しましょう。
一番大切なのは「保存するファイルの形式選び」と、書き出し時の「ちょっとした設定」だけです。
ここさえ間違えなければ、透明な部分はきれいなまま保存できるので、順番に見ていきましょう。
保存形式はJPEGではなくPNGを選べば透明なまま保存できます
「いつも写真の保存で使っているJPEGなら大丈夫だろう」
と思って保存したら、背景が真っ白になってしまった経験はありませんか。
あの時のガッカリ感、すごくわかります。
でも大丈夫、保存形式を「PNG（ピング）」にするだけで、その悩みは一発で解決します。
実は画像ファイルにはそれぞれ「得意なこと」が決まっていて、JPEGは「透明」という情報を記録できないんです。
一方でPNG形式は、Webやデジタル画像で「透明部分」を扱うために作られた形式なので、何もしなくても透明な情報をそのまま保持してくれます。
Photoshopの仕様上も、透明情報を維持して書き出す際の標準的なフォーマットとしてPNGが推奨されています。
さらに安心できるポイントとして、PNGは画像を圧縮しても画質が劣化しにくいという特徴もあるんです。
PNG形式を選ぶメリット
- 透明な背景をそのまま保存できる
- 何度保存し直しても画質が劣化しにくい
- ロゴやイラストの輪郭がきれいに残る
ここでのコツは、書き出し形式の選択肢が出てきたら迷わず「PNG」を選ぶことです。
写真素材などで
「ファイルサイズを極限まで小さくしたい」
という特別な事情がない限り、背景透過にはPNGを選んでおけば間違いありません。
この仕組みさえ知っておけば、もう保存後に「白くなってる！」と焦ることはなくなります。
ぜひ公式サイトで最新のPhotoshopの書き出し機能を確認してみてください。
書き出し画面で透明部分という項目にチェックを入れれば大丈夫です
「PNGを選んだはずなのに、プレビュー画面で見ると背景が白いまま…」
ということもありますよね。
そんな時は、設定画面のどこかにあるチェックボックスを見落としているだけなので安心してください。
具体的には、書き出し設定の中にある「透明部分」という項目にチェックを入れるだけで解決します。
Photoshopの「Web用に保存（従来）」などの画面では、このチェックが外れていると、強制的に背景色（多くはマットと呼ばれる色）で塗りつぶされてしまう仕組みになっています。
逆に言えば、ここさえチェックが入っていれば、ソフト側が「あ、ここは透明にしたいんだな」と正しく認識してくれるんです。
もし迷ったら、設定画面で「市松模様」が見えるかどうかだけを確認するようにしてみてください。
これだけで、うっかり設定ミスを防いで確実に透過画像を保存できるようになります。
初期設定でチェックが入っていることも多いですが、念のため確認する癖をつけておくと安心です。
公式サイトで詳細な設定画面のガイドを確認するのもおすすめです。
元の背景レイヤーにある鍵マークを外して非表示にすれば白く残りません
書き出しの設定以前に
「そもそも編集中の画面で背景が消えてくれない」
と悩んでいませんか。
それは画像を開いた時に最初からある「背景レイヤー」がロックされているのが原因です。
レイヤーパネルを見て、一番下のレイヤーにある「鍵マーク」をクリックして解除し、目のアイコンを消して非表示にするだけで、透明な状態を作れます。
Photoshopでは、新しく画像を開くと「背景」という名前のレイヤーが作られ、これは仕様上、透明にできない特別なレイヤーとして扱われます。
そのため、いくら消しゴムツールで消しても、設定した背景色（通常は白）が出てきてしまうのです。
背景を透明にする手順
- レイヤーパネルを開く
- 「背景」レイヤーの鍵マークをクリック（これで「レイヤー0」になります）
- 目のアイコンをクリックして非表示にする、またはそのレイヤー自体を削除する
この「鍵を外す」という一手間を加えるだけで、背景は自由に透明にできるようになります。
あとは残したい被写体だけのレイヤーを表示させておけば、きれいな透過画像データの完成です。
慣れてしまえば1秒でできる操作なので、まずはレイヤーパネルを確認する癖をつけてみてください。
公式サイトでレイヤー操作の基本チュートリアルを見てみるのも良いでしょう。
Web用に保存という機能を使えば画質を見ながら書き出せます
「書き出した後に画質が悪かったらどうしよう」と心配な方には、とっておきの機能があります。
通常の「保存」ではなく、書き出しメニューにある「Web用に保存（従来）」という機能を使うのが一番安心でおすすめです。
この機能を使うと、保存する前に「書き出し後の画質」と「元の画像」を並べて見比べることができます。
実際にWebデザインの現場でも、画質とファイルサイズのバランスを調整するために頻繁に使われている機能です。
画面内で「PNG-24」を選んだり、先ほどの「透明部分」のチェックを入れたりした結果がリアルタイムで反映されるので、失敗する確率がぐっと減ります。
メニューの場所
「ファイル」＞「書き出し」＞「Web用に保存（従来）」
少し設定項目が多い画面が開きますが、基本的には「プリセット」からPNG形式を選ぶだけで大丈夫です。
「保存ボタンを押す前に結果が見える」という安心感は大きいので、ぜひ活用してみてください。
この機能の詳細は公式サイトのガイドでも確認できます。
アドビ公式サイト
👉 同じスキルのデザイナー、いくらもらってるかがわかります
あなたよりPhotoshopが下手でも
年収が高いデザイナーは普通にいます
「デザイナーは給料が低い…」
それを信じている人だけが、ずっと損をします。
評価される場所を知っているかどうか。
違いは、それだけです。
LINEで無料相談できる
クリエイター専門転職エージェント
＼自分の市場価値を今すぐ確認する／
Photoshopの背景透過データが白くならずに書き出しできる設定を選べば解決します
ここからは、実際に作業をしていて遭遇しがちな
「あれ？うまくいかない」
というトラブルを解消していきます。
微妙な設定の違いや、自動選択ツールのクセなど、ちょっとしたポイントを押さえるだけで、思い通りのきれいな切り抜き画像を保存できるようになります。
画像がどうしても白くなる時は透明部分のチェック漏れを見直せば直ります
何度やっても背景が白くなってしまう時
「自分のPhotoshopが壊れているんじゃないか…」
と不安になるかもしれません。
でも、その原因のほとんどは単純な「透明部分」のチェック漏れであることが多いです。
特に「Web用に保存」の画面では、プリセット（保存設定の組み合わせ）を変えた拍子に、勝手にチェックが外れてしまうことがあります。
Photoshopは「前回使った設定」を記憶することもあるため、一度設定が変わると、次からも白背景で出力されるようになってしまうのです。
ここを再確認！
- 形式が「JPEG」になっていませんか？（JPEGだと透明部分の項目自体が出ません）
- 形式を「PNG-24」にした後、「透明部分」のチェックボックスが空欄になっていませんか？
もし白くなってしまったら、保存画面をもう一度開いて、この項目だけをじっくり確認してみてください。
必ず「あ、ここが外れてた！」という発見があるはずです。
冷静に見直せば必ず直せるので、公式サイトのトラブルシューティングなども参考にしながら設定を確認してみましょう。
背景が消えない時はレイヤーのロックを解除すれば操作できます
「消しゴムで消しても背景色が残る」
「選択範囲を削除できない」
という時は、レイヤーのロックが原因です。
レイヤーパネルにある小さな「鍵のアイコン」をクリックして解除すれば、すぐに自由な編集ができるようになります。
Photoshopでは、誤操作を防ぐために特定のレイヤーを「一切編集できない状態」にする機能があり、背景レイヤーはデフォルトでこれになっています。
ロックがかかっていると、透明にする処理だけでなく、移動や変形もできません。
「なんか操作できないな」と思ったら、まずはレイヤーパネルを見る癖をつけるとスムーズです。
ロックさえ外せば、あとは消しゴムでも自動選択ツールでも、好きな方法で背景を透明にできます。
これで思い通りの画像が作れるようになるので、ぜひ試してみてください。
公式サイトでレイヤー機能の基本をチェックするのもおすすめです。
複雑な部分が消えすぎる時は隣接のチェックを外せば調整できます
「髪の毛の間や、細かい隙間の背景がうまく消えない」
と悩んでいませんか。
自動選択ツールやマジック消しゴムツールを使う際、画面上部のオプションバーにある「隣接」というチェックを外すと、一気にきれいに消せるようになります。
「隣接」にチェックが入っていると、クリックした場所と「つながっている部分」しか選択されません。
逆にこれを外すと、画像全体から「同じ色の部分」を離れた場所も含めてまるごと選択してくれます。
例えば、レースのような複雑な模様の隙間にある白背景も、ワンクリックですべて選択して消すことが可能になるんです。
「隣接」の使い分け
- チェックあり：つながっている部分だけ消したい時
- チェックなし：離れた場所にある同じ色もまとめて消したい時
ただし、服の模様など「消したくない部分」まで同じ色だと消えてしまうことがあるので、そこだけ注意すれば非常に強力な機能です。
この機能を使いこなせば、複雑な切り抜き作業の時間が劇的に短縮されます。
公式サイトで選択ツールの詳細なオプションを確認してみましょう。
クイック書き出しを設定しておけばすぐに保存できて便利です
毎回「Web用に保存」の画面を開いて設定するのが面倒だと感じる方もいると思います。
そんな時は、右クリックひとつで保存できる「クイック書き出し」の設定をPNGにしておくと非常に便利です。
Photoshopの環境設定で「書き出し」の項目を選び、クイック書き出しの形式を「PNG」に設定しておくだけで準備は完了します。
これを設定しておけば、レイヤーパネルで右クリックして「PNGとしてクイック書き出し」を選ぶだけで、瞬時に透過画像を保存できるようになります。
画質の微調整などはできませんが、とにかく素早く素材を書き出したい時には最強の時短テクニックです。
設定場所
メニューバーの「編集」＞「環境設定」＞「書き出し」から設定できます。
一度設定してしまえば、あとは迷うことなくワンクリックで透明背景の画像が手に入ります。
毎回の作業が驚くほど楽になるので、ぜひ設定を見直してみてください。
公式サイトで環境設定のカスタマイズ方法を確認するのも良いでしょう。
まとめ：Photoshopで背景透過したデータを書き出しする方法はPNG一択で大丈夫です
いろいろな形式や設定があって混乱してしまうかもしれませんが、最終的な結論はシンプルです。
背景を透明にしたいなら、「PNG形式」を選んで保存すれば間違いありません。
GIF形式など他にも透明を扱える形式はありますが、画質のきれいさや扱える色の数、今のWeb標準を考えると、PNGが最も安全で確実な選択肢だからです。
「背景透過＝PNG」というルールさえ覚えておけば、もう保存形式で迷うことはなくなります。
もし誰かにデータを渡す時も、PNGなら相手の環境でもきれいに透過された状態で表示されます。
これでもう、背景が白くなってやり直すストレスからは解放されます。
自信を持って背景透過画像を書き出すために、ぜひ公式サイトで最新の機能情報をチェックしてみてください。
アドビ公式サイト
👉 今の給料と評価に満足してるなら、何もしなくて大丈夫です
毎年、仕事も責任も増える。でも給料だけは変わらない…
LPも、バナーも、修正も。
仕事は増えるのに、給料は変わらない。
Photoshopのスキルは上がっているのに、
評価はずっと据え置き。
「デザイナーだから仕方ない」
本当に、それが普通ですか？
デザイナーを戦力として扱う会社は、実在します。
LINEで無料相談できる
クリエイター専門転職エージェント
＼自分の市場価値を今すぐ確認する／