【イラレ2025】画像の縁取り!透過画像を白く縁取る方法について解説

Adobe備忘録
スポンサーリンク




※本サイトで紹介している商品・サービス等の外部リンクには、アフィリエイト広告が含まれる場合があります。

悩めるデザイナーインコ
悩めるデザイナーインコ

画像を白い線でフチ取りしたいんだよね!でもうまくいかないよ!

悩めるクリエイターバード
悩めるクリエイターバード

薄いぼやっとした感じの影縁取りたいが……

と困ったことはありませんか?

イラレ_透過画像を白く縁取る方法

縁取られたイラストや画像はとてもオシャレです。けれど、画像をイラレにそのまま投げて縁取りしようとすると、イラスト部分ではなく無の空間に長方形の線ができるだけで終わってしまいます。

そこで今回は、illustrator2025における

・透過画像を白く縁取る方法

について解説します。

スポンサーリンク




透過画像を白く縁取る方法

ぼんやりした線で縁取りをする方法

ぼやっとした縁取りは簡単に行えます。具体的なやり方を見ていきましょう。

まずはじめに、縁取りしたい画像を選択状態にしておきます。
その状態で、アピアランスパネルを見てみましょう。
(アピアランスパネルが見当たらない場合は、画面上部のメニューバーにある「ウィンドウ」の「アピアランス」をクリックしてください)

イラレ_透過画像を白く縁取る方法_アピアランスパネル

アピアランスパネルの下の方に、「fx」というアイコンがあるのでクリックしてください。
表示された中にある「スタイライズ」の「ドロップシャドウ」を選択しましょう。

イラレ_透過画像を白く縁取る方法_ドロップシャドウ

ドロップシャドウのウィンドウが開きます。

それぞれの項目を、お好みの縁取り感になるように調整しましょう。

イラレ_透過画像を白く縁取る方法_ドロップシャドウを調整

例えば筆者の場合、以下画像のように数値変更したらちょうど良かったです。

イラレ_透過画像を白く縁取る方法_ドロップシャドウの数値例

「OK」を押せば、ぼんやりとした縁取りが完成です。

イラレ_透過画像を白く縁取る方法_ぼんやりとした縁取り

くっきりした線で縁取りをする方法①

くっきりした線で縁取る方法はいくつかあります。本記事では2つ取り上げますが、どちらが適しているかは画像によって変わるかと思います。
いずれも試してみて、より適したやり方を見付けてみてください。

Part1は「画像トレース」を活用する方法です。

まずはじめに、画面上部のメニューバーにある「ウィンドウ」を押し、表示された中にある「画像トレース」をクリックします。

イラレ_透過画像を白く縁取る方法_画像トレース

縁取りしたい画像を選択状態にすると、さまざまな項目が変更できるようになります。
主に「プリセット」と「カラーモード」を変更しましょう。

プレビュー」にチェックを入れてから、項目をいろいろ試して、現在の画像の色味・雰囲気を極力損なわない項目を見付けてください。

イラレ_透過画像を白く縁取る方法_画像トレースでプリセットやカラーモードを変更

現在の画像の色味・雰囲気を極力損なわない項目に変更したら、「拡張」を押しましょう。

イラレ_透過画像を白く縁取る方法_画像トレースで拡張
例えば、筆者の場合はプリセットを「写真」、カラーモードを「カラー」が最も適していました。少し色味が変わっていても、ベクター化の影響で色変更が効くのでまあいいだろう

すると、画像がベクター化されます。

イラレ_透過画像を白く縁取る方法_画像がベクター化

画像を選択した状態でアピアランスパネルを開きましょう。

アピアランスパネルの左下あたりに「新規線を追加」アイコンがあるので、それをクリックしてください。

イラレ_透過画像を白く縁取る方法_新規線を追加

「線」項目を、「内容」項目の下の階層に移動させます。

イラレ_透過画像を白く縁取る方法_「線」項目を、「内容」項目の下の階層に移動

後は、線を太くしたり色変更したりすれば、縁取りの完成です。

イラレ_透過画像を白く縁取る方法_縁取りの完成

「線」という文字をクリックすると、線に関する詳細を調整できるパネルが開きます。
角の形状」で真ん中のアイコン「ラウンド結合」を選ぶと、より綺麗な縁取りにできるかもしれません。

イラレ_透過画像を白く縁取る方法_ラウンド結合

くっきりした線で縁取りをする方法②

くっきりした線で縁取る方法Part2です。「オブジェクトのアウトライン」を活用します。

画像を選択状態にしてから、アピアランスパネルを開きます。
新規線を追加し、太めの線にしてください。

この際、線が表示されていないように見えるかと思いますが、気にしなくて問題ありません。そのまま進んでください。

イラレ_透過画像を白く縁取る方法_新規線を追加

アピアランスパネルの下の方にある「fx」アイコンを押し、「パス」に分類されている「オブジェクトのアウトライン」を選択してください。

イラレ_透過画像を白く縁取る方法_オブジェクトのアウトライン

すると、急に線が出現します。

イラレ_透過画像を白く縁取る方法_線が出現

「線」項目を、「内容」の下の階層に移動させましょう。

その後、線の太さや色を調整すれば完成です。

イラレ_透過画像を白く縁取る方法_「線」項目を、「内容」の下の階層に移動

「線」という文字をクリックすると、線に関する詳細を調整できるパネルが開きます。
角の形状」で真ん中のアイコン(ラウンド結合)を選ぶと、より綺麗な縁取りにできるかもしれません。

イラレ_透過画像を白く縁取る方法_角の形状

説明は以上です。お疲れ様でした。

⚠Adobeの更新時期が近いのに、どの方法が安く済むのか分からず、つい更新を後回しにしていませんか

少しでも安く使い続けたい気持ちはあっても、それを調べるのは正直面倒ですよね。
以前、お得なやり方でライセンスを購入できた方でも、その方法が今も同じように安いとは限りません

何も調べずにいつもの流れで更新すると、知らないうちに余計な費用を払ってしまうかもしれません。無駄な出費を避けたい方は、こちらの記事をチェックしてみてください

その他:初心者デザイナー・動画クリエイターの方へ

本記事を読んでくださっている方は、動画クリエイター・デザイナーを目指して勉強中の方、もしくは未経験からご自身で学びながら案件をこなしている方が多いのではないでしょうか?

「学んだスキルを使って、自分のペースで働きながら収入を得たい!」
「会社に縛られず、好きな場所で好きな仕事をして生活できるようになりたい……!!」

そんな理想を叶える第一歩としておすすめなのが、クラウドソーシングサイトの活用です。

クラウドソーシングサイトでは学んだスキルを実際の仕事で活かしながらお金を稼ぐことができるので、「好きなことを仕事にして稼ぐ」第一歩を踏み出せます。

さらに、実績が増えて「○件の制作経験あり」とプロフィールに書けるようになると、企業からの仕事依頼や就職できるチャンスが増え、稼ぎにつながります

筆者はかつて、個人のクリエイターとしてクラウドソーシングサイトで仕事をしていましたが、そこで実績を積むことが出来たため、今は理想的な会社でデザイナーとして働けています。

実績を積むことは、個人で自由に仕事することにも、就職して安定した収入を得ることにもつながりますよ!

そんな初心者におすすめのクラウドソーシングサイトをまとめた記事がこちらです。
大学生向けとしていますが、社会人副業を考えている方にも十分役立つ内容になっています。

タイトルとURLをコピーしました