
ホームページ用の画像や、写真を扱っていて、
- アイコンの色を変えたい
- 写真の特定部分の色を別の色に変えたい
といった事もあるかと思います。
その際に、用意している画像が、SVGやpsdなどPhotoshopでそのまま操作ができる場合には問題ありません。
しかし、pngやjpegなど操作ができない画像の場合には、Photoshopの機能を利用して変える必要があります。
そこで今回は、pngやjpegなどの画像の特定の色を変更するための方法をご紹介します。
注意事項:著作権にはご注意ください
画像を操作する場合など、製作者が改変を認めていない場合もあります。
そのため、画像の著作権や、改変しても良いかは、必ず確認するようにしてください。
2つの簡単な実施方法
Photoshopで特定の色を別の色に置き換えるには、
- 1.色調補正を利用する
- 2.新規塗りつぶしレイヤーを作成する
の2つがあります。
上記2つの方法ですが、「1.色調補正を利用する」に関しては、非常に簡単にできるのですが、白黒グレーなどのモノトーンのカラーに対してはできません。
そのため、基本的には、「1.色調補正を利用する」を行い、モノトーンカラーの場合には、「2.新規塗りつぶしレイヤーを作成する」といった形で使い分けるのがおすすめです。
今回は、両方ともご紹介させていただきます。
方法1:色調補正を利用する
わかりやすいように今回は、イラストで行います。

[イメージ]-[色調補正]-[色の置き換え]をクリック

スポイトツールを利用し、変更したい色を選択

変更後の色を選択

[OK]を選択する事で画像の色が変わります。

また、この際に選択ツールなどで範囲を指定して変更する事も可能です。
方法2:新規レイヤーを作成する
今回はモノトーンのイラストを利用します。

[選択範囲]-[色域指定]を選択

スポイトツールを利用し、変更したい色を選択し、[OK]をクリック

特定の色の範囲が選択された状態で、[レイヤー]-[新規塗りつぶしレイヤー]-[ベタ塗り]をクリック

名前を入力し、[OK]をクリック

変えたい色を選択し、[OK]をクリック

まとめ
ホームページを製作する際に、画像は非常に重要で、印象を大きく左右させてしまいます。
もちろん、最初から想定した色の画像や写真が用意できれば一番です。
しかし、常に用意ができるとは限りません。
そのため、素材がなかった場合、用意が難しい場合などには、今回の方法をご活用ください。
投稿者プロフィール

こんにちは。㈱シンラウンド代表の中島 達(@NakajimaSatoru)です。