HOME
本記事は執筆時点（2023年02月22日）の情報をベースにしております。掲載している情報が最新ではない可能性がありますので何卒ご容赦ください。
背景を透過させて保存するには？
ボタンやアイコンなどWebページで使うパーツは背景を透過させておくことがほとんどだと思います。
Inkscapeでは、ドキュメント内のオブジェクトを背景の透過に対応したファイル形式であるPNG（Portable Network Graphics）に簡単にエクスポートすることが可能です。
PNG画像にエクスポートする
「PNG画像にエクスポート」は、PNGに書き出したいオブジェクトを選択した状態で、メニューバーの「ファイル」の中から選択するか、キーボードのショートカット「Shift + Ctrl + E」を押して実行します。
「PNG画像にエクスポート」ダイアログが開かれます。
- 「エクスポート領域」4つの中からで書き出す範囲を選択します（詳しくは後述します）
- ファイルの保存先とファイル名を決めます
- エクスポートを押して完了です
エクスポート領域には「ページ」「描画全体」「選択範囲」「カスタム」の４種類があり、それぞれファイルに書き出す範囲が異なりますので目的に応じて使い分けて下さい。
今回のようにオブジェクトごとにPNGに保存したい場合は、「選択範囲」で書き出します。
InkscapeでPNG画像として保存する方法について詳しくはこちらのページを参考にしてください。
Inkscapeでファイルを保存する方法
通常の保存手順をはじめPNG画像にエクスポートする方法を解説します。「PNG画像にエクスポート」では4つの「エクスポート領域」の中からで書き出...【もっと読む】
背景が透過されない時は？
前述の手順でPNGにエクスポートしたにも関わらず、背景が透過できないケースがあります。
下の例のように白い背景が付いてしまっているような場合です。
ドキュメントに背景色が設定されていることが原因
エクスポートしたPNGデータに先程のような白い背景が付いている場合は、作業中のドキュメント全体は次のような白い状態になっているはずです。
一見すると背景が無く透明のようにも思えますが、実は見た目そのままドキュメント全体の背景に白色が適用された状態になっているのです。
オブジェクトの選択範囲は四角い枠なので、背景の白も一緒に書き出されてしまっているという訳です。
ドキュメントのプロパティの背景色を透明にする
この問題は、ドキュメントの背景色を透明にすれば解決します。
ドキュメント全体に関する設定は、「ドキュメントのプロパティ」で行います。
画面左上の「ファイル」の中から「ドキュメントのプロパティ」をクリックするか、キーボードのショートカットキー「Shift + Ctrl + D」を押して開きます。
ドキュメントのプロパティは複数のタブに分かれているので、「ページ」タブに切り替えて下さい。
下の方にある「Background」の項目の「Checkerboard background」にチェックを入れれば完了です。
ドキュメント全体が白ではなく、グレーのチェック模様になっていれば背景は透明の状態です。
この状態でオブジェクトを選択してPNGにエクスポートすれば背景を透過させて保存することができます。
まとめ
Inkscapeで背景を透過させてPNG形式でエクスポートする手順です。
初期設定ではドキュメントの背景色が白になっているので気づきにくいかもしれません。作業をはじめる前に「Checkerboard background」にチェックを入れて、背景を透過させておいた方が作業がしやすいです。
