この記事ではイラレで画像の背景を透過させる方法を紹介します。
イラレの背景は初めから透明？
イラレのアートボードを見ると背景が白くなっていますよね。
しかし実際の背景色は透明です。
※アートボードの背景が白くなっているのは使用者が作業しやすくするためです。ですが実際の背景色は透明です。
「透明グリッド」という機能を使うことで背景が透明だとわかります。
透明グリッドの使用方法
メニューバーの「表示」→「透明グリッドを表示」を選択します。
するとアートボードの背景が透明になります。
透明のグリッドを使用することで画像が透過されているか確認出来ます。
※Macの場合は「⌘ ＋ D」、Windowsの場合は「ctrl ＋ D」のショートカットでも出来ます。
イラレで画像の背景を透過させて書き出す方法
では実際にイラレで背景を透過させた画像を書き出す方法を紹介します。
- 「書き出し形式」を選択する
- ファイル形式で「PNG」を選択する
- オプションを設定する
「書き出し形式」を選択する
まず始めに「書き出し形式」を選択します。
画像を選択した状態で「ファイル」→「書き出し」→「書き出し形式」を選択します。
ファイル形式で「PNG」を選択する
続いてファイル形式から「PNG」を選択します。
※他にもJPGやSVGなどありますが、背景を透過するにはPNGとなります。
オプションを設定する
最後に書き出しのオプションを選択します。
PNGのオプションは下記のように設定してください。
- 解像度：「スクリーン(72ppi)」
- web制作では解像度は72ppiで設定します。ちなみに印刷物の場合は300ppiを選択します。
- アンチエイリアス：「アートに最適(スーパーサンプリング)」
- 画像のエッヂを滑らかにする機能です。
- 背景色：「透明」
書き出された画像を確認して背景が透過されていたら完成です。
背景が透過されない原因
設定を間違えると背景が透過されません。
- JPEGなど異なる拡張子を選択している
- 画像の背景に白色の図形が含まれている
JPEGなど異なる拡張子を選択している
JPEGなど異なる拡張子を選択していると透過されません。
JPEG自体はweb制作では頻繁に使用します。
しかしJPEGには背景を透過させる機能が備わっていません。
そのため透過させたいのであればPNGで書き出してください。
画像の背景に白色の図形が含まれている
画像の背景に白色の図形が含まれていると透過されません。
アートボードが白色なので、同色の図形が含まれていても中々気づけません。
「透明グリッド」を使って透過されているか確認してください。
最後に
この記事ではイラレで画像の背景を透過する方法を紹介しました。
書き出す画像の背景を透過することは簡単です。
知らなかった方は是非やってみてください。