Png transparency2

画像の背景を透明にする為に、透過PNGの作り方をご紹介します。
透過PNGを作るには無料ソフトでも作れますが、Macの標準機能で簡単に作る事ができます。 Mac OS Xに標準搭載の画像閲覧、編集アプリの「プレビュー」を使います。 今回は、ブログのヘッダー画像の背景を透明にする為に透過PNG形式で画像を作ってみました。

当ブログヘッダーは、タイトルを画像で表示してるのですが、下の画像は、ページの背景とあっていません。この水色の部分を透明にしてページの背景が見えるようにします。
39c268a2ef471ab768b79348abe7c3c8 a

Macのプレビューで透過PNGの作り方

画像をPNGに変換する

画像をまずMacのプレビューで開きます。
画像形式がJPEGやGIFなどPNG以外なら一旦PNGに変換する必要があります。画像形式は、画像タイトルの拡張子で確認できます。

画像形式がPNGならそのまま編集ができますので、このステップは飛ばしてください。

※下の説明の画像は、見やすいように画像の一部のみ表示してます。
スクリーンショット 2014 12 01 00 27 14

「ファイル」メニューから「書き出す」を選択します。
スクリーンショット 2014 12 01 00 14 53

フォーマットは「PNG」を選択して「保存」をクリックします。
スクリーンショット 2014 12 01 00 15 28

画像タイトルの拡張子が、「PNG」に変わりました。
スクリーンショット 2014 12 01 00 14 10

 PNG形式の画像背景を削除する

「 ツール」メニューから、「カラーを調整」を選択します。
スクリーンショット 2014 12 01 00 35 16

ツールバーが表示されるので、似た色を選択できるツール「インスタントアルファ」をクリックします。
スクリーンショット 2014 12 01 00 38 05

画像の消したい部分をクリックしたまま動かしてドラッグすると選択できます。ツールバー右端の「切り取り」を押すと選択した部分以外が消えるので、キーボードの「delete」キーを押します。
スクリーンショット 2014 12 01 00 39 13

画像の選択部分が削除されて、背景が消えました。 削除したい部分が残っていれば、この作業を繰り返します。
スクリーンショット 2014 12 01 00 58 07

画像の背景が透明になり、ページの背景が見えるようになりました。
6b3e15e5d6cf7707390d320491313967 a

シェアしていただけると励みになります

この記事が気に入ったら
フォローしよう

最新情報をお届けします

Twitterでフォローしよう