PNGをコピペすると透明背景が黒くなっちゃう問題

簡単時短テクあります!
Minoru Nitta
Minoru Nitta
グラフィックデザイナー・フォトグラファー
このエントリーをはてなブックマークに追加

ウェブからPNG画像をPhotoshopへコピペすると背景が黒くなる

 上の黒い四角、透明の背景付きの黒い色のサイトロゴをブラウザーでコピーしてPhotoshopにペーストしたものです。

 ウェブブラウザで透明背景つきのグラフィックをコピー&ペーストすると背景部分が黒く塗りつぶされてしまいます。

 こういうもんだと思って、一回ファイルに保存して開いてましたが、時短テクを発見しました。

背景を透明のままPhotoshopで開く方法

 手順は簡単、画像のアドレスをウェブブラウザでコピーして、Photoshopのファイルを開くダイアログのファイル名にその画像のアドレスをペーストして開くだけです。具体的な手順は次の通り。

まずはブラウザです。今回はChromeを使っています。

目的の画像の上で右クリックして画像をコピーしたりしますが、今回は画像のアドレスをコピーします。

https://crft.jetsets.jp/wp-content/uploads/2020/08/crft_logo.svg

 crftのロゴのアドレスはこんな感じです。今思い出しましたが、crftのロゴマークは.svgでした。でも大丈夫、svgファイルでも同じことです。

 次にPhotoshop、Ctrl+Oで普通にファイルを開くを実行します。

 このファイル名のところに、さっきコピーしたアドレスをペーストして、開くをクリックします。そうするとそのままファイルをウェブサーバーから開くことができます。

 さて、これを保存すると、どうなるのか?まさかサーバーのファイルは書き換えることはできません。新規に保存ダイアログが表示され新たに保存することができるようになります。