WEB業界で働く人や興味がある人に役立つ情報サイト“qam（カム）”

投稿者： スーザン
カテゴリー： デザイン >Photoshop

WEBサイトで背景やメインビジュアルに写真を使うとき、通常のカラー写真じゃなくて単色にしたい時はありませんか？
文字の可読性を上げたいから単色にしたい。
コンテンツの途中に背景として使用したい。
白黒のやり方はわかるんだけど、自分の好きな色にする方法がわからない。。
そんな時に役立つ方法をご紹介します。

写真を白黒に変換する

今回はこちらの風景写真を使用します。

①まずPhotoshopで使用したい写真を開きます。

②メニューバーのイメージから
「モード」＞「グレースケール」を選択します。

③下記ような「カラー情報を破棄しますか？」というメッセージが出てきますが、こちらは「破棄」を選択してください。

写真が白黒に変換されました。

写真を好きな色に変換する

①先程変換した白黒写真の状態で
メニューバーのイメージから
「モード」＞「ダブルトーン」を選択します。

②選択をすると「ダブルトーンオプション」という表示が出てくるので、図のカラー部分（赤枠で囲ってあるところ）をクリックします。

③クリックをするとカラーパネルが出てくるので変更したい好きな色を選択します。今回はオレンジ色に変更しました。

④「ダブルトーンオプション」のカラー部分がオレンジ色になっているので、任意の名前をつけて「OK」を選択します。

あっという間にオレンジ色に変更されました！

【おまけ】色の濃淡を調整する方法

もう少し色の濃淡を調整して効果的にみせたいなという時は
「ダブルトーンオプション」のダブルトーンカーブ（赤枠で囲ってあるところ）をクリックします。

通常のトーンカーブと同じように調整をしていきます。

すると色の濃淡がよりはっきりとして、効果的な写真が出来上がりました。
用途に合わせ、色々試してみてくださいね。