フリーランスデザイナーが自由なライフスタイルを実現するための新しいブログの活用法や個性的がほとばしるブログにするためのPhotoshopを使ったデザインのチュートリアルなどを公開中~。

photoshopで文字や図形を縁取りする1番簡単な方法。レイヤースタイルに境界線を適用する&小技

一番簡単な縁取り

photoshopでも文字や図形などを縁取りしたい場合はレイヤースタイルの境界線を適用すれば初心者でも簡単にできます。

ここでは単純に境界線を適用するだけではなく、2重に縁取りをさせる方法と、縁取りだけを残しテキストを消す方法を説明します

Photoshop CS6背景素材
所要時間の目安3分 宇宙素材
画面サイズ570×480:解像度72pixel/inch123RFについて 》
文字や図形を縁取りするチュートリアル

背景画像をphotoshopで開く。

背景

任意のテキストや図形を入力

テキスト入力

テキストにレイヤースタイルの境界線を適用。

境界線

境界線のサイズやカラーを調整。単純に縁取りするだけであればこれだけの作業で完成!

レイヤースタイルを調整

図形も同様に境界線を適用することができます。

図形にも境界線

レイヤースタイルをラスタライズすると境界線の外側(内側)にさらに縁取りすることができます

ラスタライズ

境界線の調整。

ラスタライズに境界線

これでテキストや図形に境界線を適用させ、さらに2重に縁取りすることができました。しかし一旦ラスタライズしてしまうとその後の柔軟な調整がきかなくなってしまいます

そこで、2重までの縁取りであればラスタライズせずに、レイヤースタイルのドロップシャドウの数値調整で境界線を代用させてみよう。

ラスタライズせずに2重に縁取りする小技

境界線を適用したテキストレイヤー(ラスタライズしていない状態)にドロップシャドウをを適用させ、【描画モード ⇒ 通常】【カラー ⇒ 任意】【不透明度 : 100】【距離 : 0】【スプレッド : 100】【サイズ : 任意】に調整。

ラスタライズせずに境界線

このようにラスタライズさせずに2重の縁取りが完成しました、この状態であればテキストのサイズ調整なども可能です

文字や図形に縁取り完成

縁取りだけを残すことも可能。

ラスタライズしていなければテキストレイヤーを【塗り:0%】にすることで縁取りだけを残すこともできます

縁取りのみ

ここでは基本的な縁取り方法を説明しましたが、この基本をマスターしておくと多彩な応用が利くようになります。応用編はこちら ⇒ photoshopで縁取りを応用し素人っぽさから一歩抜け出すスゴ技を伝授。

スリームデザイン無料の公式メールマガジン スリームデザインのメールマガジン

関連記事

Wordpress日本語テーマのまとめ
個別ブログ相談会
photoshop日本語チュートリアル
ブログラ

スリームデザインの出版書籍情報

photoshopの本

fotoliaデザインコンテスト大賞受賞作品の解説

tenコレクションデザインコンテスト

スリームデザインおすすめの書籍

本 本本 本

スリームデザインとソーシャルで繋がろう!

 
 
 

カテゴリー