Topics インフォコネクト最新情報

簡単!Photoshopで画像に左右両方からグラデーションをかける方法

簡単!Photoshopで画像に左右両方からグラデーションをかける方法

Photoshopの豆知識

この記事は公開から1年以上経過しています。

こんにちは、WebデザインナーのAYAです。
今回はPhotoshopで画像に左右両方からグラデーションをかける方法について紹介します!

このテーマを選んだ理由は、私がPhotoshopを使い始めた当初、画像の片側にグラデーションをかけた後に、もう一方の側にもグラデーションをかけたいと思った時に、上手くできず苦戦した経験があったためです。そのような方々のお役に立てるよう、このテーマを選びました。

では、早速いきましょ~!

簡単!Photoshopで画像に左右両方からグラデーションをかける方法

まず、アートボードに画像を配置します。

簡単!Photoshopで画像に左右両方からグラデーションをかける方法

そして、画像のレイヤーにベクトルマスクを追加します。ベクトルマスクを追加すると、②のようになります。

簡単!Photoshopで画像に左右両方からグラデーションをかける方法

そしてグラデーションツール(G)で、画像の左端っこをタップして左から右へドラックします。

簡単!Photoshopで画像に左右両方からグラデーションをかける方法

すると、このようにグラデーションがかかりますね。

簡単!Photoshopで画像に左右両方からグラデーションをかける方法

次に、反対からもグラデーションをかけたいのですが。このままの状態で右からグラデーションをかけると、先ほどかけた左からのグラデーションが消えてしまいます。これでは困りますよね。

ですので、画像を一度グループ化します。
※ショットカートキーは、
Macの場合、Command+G
Windowsの場合は、Control+G
そしてグループ化されたレイヤーに、もう一度ベクトルマスクを追加します。

簡単!Photoshopで画像に左右両方からグラデーションをかける方法

ベクトルマスクを追加したら、同じようにグラデーションツールに持ち替えて、右から左へドラックしてグラデーションをかけます。

簡単!Photoshopで画像に左右両方からグラデーションをかける方法

これで、思うようにグラデーションをかけることができましたね。

以上となります!
是非一度試してみてくださいね。
 

Webの豆知識]関連記事

Service

Contact

インフォコネクトに相談してみませんか?

経営コンサルティングからITサービス活用支援、ホームページ制作などに関するご依頼や、ご質問・ご相談など、なんでもお気軽にお問い合わせください