写真にデュオトーン効果を作成する方法（デザインガイド）

最終更新日: June 28, 2026

デュオトーンとは、写真を単に2色（暗い色と明るい色）で再現するデザイン効果です。これは、影の部分とハイライトの部分に対応する形で色がマッピングされます。この効果は、普通の写真を目を引く、ブランドの一貫性のあるビジュアルに変えるための最も効果的なデザインエフェクトの一つです。本ガイドでは、デュオトーン効果の仕組み、相性の良いカラーペア、適用方法、そしてデザインにおけるその位置づけについて解説します。

クイックアンサー：デュオトーンはどのように作るか？

写真をグレースケールに変換し、暗いトーンをある色に、明るいトーンを別の色にマッピングします。結果として得られるのは、完全な階調範囲を持ちながらも統一されたカラームードを持つ2色の画像です。

Tool	Method
Browser	Image Editor duotone filter
Photoshop	Gradient Map adjustment layer
ImageMagick	`-colorspace gray` + `-clut` with a gradient
Canva	Built-in duotone filter

カラーペアが最も重要なクリエイティブな決定点となります。

デュオトーン効果の仕組みは？

デュオトーンは、写真の持つフルカラーを2色のグラデーションに置き換えます。一つはシャドウ用、もう一つはハイライト用です。ミッドトーンはその間をブレンドします。写真はトーン構造（形やライティング）を保ちますが、すべてが2色の世界に収まります。

このため、単なるカラーフィルターでは失敗に見えがちなのに対し、デュオトーンは意図的に見えるのです。なぜなら、これは単一のチャンネルを着色するのではなく、全体の階調範囲をデザインされたパレットに再マッピングしているからです。この効果は印刷（二色刷り）にルーツを持ち、現在ではあらゆるデジタルデザインで活用されています。

どのようなカラーペアが最も機能するか？

コントラストの高いペアが最も力強く読めます。深いシャドウカラーと明るいハイライトカラーの組み合わせです。信頼できる方向性は以下の4つです。

Duotone color pairs: blue, red, green, and purple tints on the same photo

Mood	Shadow color	Highlight color
Corporate / tech	Deep blue	Light blue / white
Bold / energetic	Dark red	Cream
Calm / natural	Forest green	Pale green
Creative / premium	Deep purple	Pink

最も安全な出発点は、両端（暗い部分と明るい部分）に同じ色を使用することです。これにより調和が保証されます。ブランドの作業の場合は、そのブランドの色を使用してください。

デュオトーンはどこで使われるか？

デュオトーンは、「写真を撮り直さずに、一連の写真に統一感のある、ブランドらしいルックを与える」という特定のデザイン問題を解決します。

Duotone is used for hero banners, posters, and branding where a unified color mood matters

Hero banners — デュオトーンの背景は、ストック写真とブランドパレットを統一します。
Posters and flyers — 印象的で、2色印刷に適しています。
Branding — 様々なソース写真にわたるキャンペーン全体での一貫したビジュアルを実現します。
Editorial — 統一されたカラームードを持つ雑誌のページ構成。

共通しているのは「一貫性（cohesion）」です。デュオトーンは、ミスマッチな写真をまるで一つのセットのように見せます。Adobe design guide to duotoneやCanva design schoolでは、このデザイン理論を深く解説しています。

方法 1：Browser editor

単一の画像の場合、Image Editorを使用します。デュオトーンフィルターを適用し、2色を選び、エクスポートするだけです。これが最も速い方法であり、カラーペアをライブでプレビューできます。

方法 2：Photoshop (Gradient Map)

写真を開きます。
Gradient Map調整レイヤーを追加します。
グラデーションの左端（シャドウ）を暗い色に、右端（ハイライト）を明るい色に設定します。
ミッドポイントを調整してトーンバランスを取ります。

Gradient Mapは、フルな階調範囲を直接2色のグラデーションにマッピングするため、最もクリーンなデュオトーンツールです。3色以上のストップを追加すればトライ・トーンやクワドトーンも可能ですが、古典的で最も強いルックはやはり2色であり、追加の色は効果を豊かにするよりも濁らせがちです。

方法 3：ImageMagick (batch)

## Build a 2-color gradient LUT, then apply it to the grayscale photo
magick -size 1x256 gradient:"#1a3a6b"-"#cfe0f5" lut.png
magick input.jpg -colorspace gray lut.png -clut output.jpg

## A folder
mkdir -p out
for f in *.jpg; do magick "$f" -colorspace gray lut.png -clut "out/$f"; done

-clut（カラールックアップテーブル）は、各グレースケールレベルをグラデーションの対応する色にマッピングし、デュオトーンを生成します。これは数百枚の画像に同じデュオトーンを適用するための適切なアプローチです。

デュオトーンに適した写真の選び方は？

デュオトーンは、強い階調コントラストとシンプルな構図を持つ写真（ポートレート、建築物、単一の被写体など）で最も効果を発揮します。細かい色彩ディテールが多い写真（混雑した市場の風景など）は、2色に減らされることで面白さの原因であった要素を失いがちです。なぜなら、この効果は意図的に色情報（hue information）を捨てて、デザインされたパレットを採用するからです。高いコントラストを持つ白黒のソースが理想的です。なぜなら、デュオトーンはその階調構造にきれいにマッピングされ、元々白黒でよく見える写真は、デュオトーンとしてもよく見える傾向があるからです。

試す方法は、写真を細めに見るか、頭の中でグレースケールに変換してみることです。もし色なしでも構図が保たれていれば、それはデュオトーンとしても成立します。写真が意味を持つために色に依存している場合（緑の木に赤いリンゴなど、カラーコード化されたチャートなど）は、デュオトーンがその意味を剥奪してしまいます。デュオトーンキャンペーンの素材を集める際は、まず形、光、コントラストを基準に撮影または選択し、色は後から適用するようにしましょう。how to enhance photo qualityを参照して、まず階調コントラストを正しく確保することが重要です。

よくある間違い

コントラストの低いカラーペア。 似た色の組み合わせは濁った画像を生みます。暗い色と明るい色を使用してください。
複雑なソース写真。 色に依存するディテールが失われます。シンプルでコントラストの高い写真を選びましょう。
ブランドカラーとの不一致。 デュオトーンを配置されるパレットの色に合わせて調整します。
ミッドポイントの忘れ。 トーンバランスはグラデーションのミッドポイントに存在します。これを調整してください。
肌への過度な着色。 顔へのデュオトーンは奇妙に見えることがあるため、実際の被写体でテストしてください。

よくある質問

デュオトーン効果とは何ですか？

写真を2色（影にマッピングされる色とハイライトにマッピングされる色）で再現し、フルカラーをデザインされたペアに置き換えながらも階調範囲を維持するものです。

どのような色がデュオトーンに適していますか？

コントラストの高いペアです。深いシャドウカラーと明るいハイライトカラーの組み合わせが理想的です。同じ色相の暗い色と明るい色の組み合わせが最も安全な出発点となります。

すべての写真にデュオトーンを適用できますか？

技術的には可能ですが、シンプルでコントラストの高い写真で最も美しく見えます。複雑なシーンは、その面白さの原因となる要素を失いがちです。

デュオトーンとカラーフィルターの違いは何ですか？

フィルターは色を着色（tint）しますが、デュオトーンは全体の階調範囲を2色に再マッピングします。これが意図的でデザイン主導に見える理由です。この再マッピングは完全であり、すべてのピクセルが選択された2色の間のグラデーションのどこかに配置されるため、最終的な画像は元の写真の上に軽い着色ではなく、意図的なアートディレクションとして読めます。

デュオトーン効果の仕組みはどうなっていますか？

デュオトーンは、画像内のすべてのトーン（黒から白まで）を2色のグラデーション（シャドウカラーとハイライトカラーの間）にマッピングします。シャドウは暗い色を取り、ハイライトは明るい色を取り、ミッドトーンがそれらをブレンドします。これは着色ではなく、トーンから色への再マッピングであり、そのためウォッシュのような見た目ではなくデザインされたルックを生み出します。

デュオトーンに最適なカラーペアは何ですか？

暗く彩度の高いシャドウカラーと、より明るく対照的なハイライトカラーです。例えば、深い青のシャドウに温かい黄色のハイライトなどです。似た色の組み合わせは濁り、読みにくい結果になります。コントラストが高いほど意図的なデザインとして機能します。同じペアでも、異なるソーストーンでは挙動が異なるため、必ず実際の画像でテストしてください。

デュオトーンはどこに使われますか？

エディトリアルデザイン、ブランディング、ヒーローイメージなど、印象的でブランド化されたルックを求める場所すべてです。デュオトーンは、一連の様々な写真を単一の色処理の下に統一するため、ブランドシステムや雑誌のレイアウトに適しています。元の色を捨てるため、自然なルックを残したい場合はオリジナルを保持してください。blend mode guideを参照してください。

テキストにデュオトーンを適用できますか？

はい。テキストにデュオトーンを適用すると、文字のトーンが2色のグラデーションにマッピングされ、印象的なブランドの見出しになります。グラデーションが明確に読めるよう、テキストはコントラストを高く保ってください。本文よりもポスターやヒーロー見出しに適しています。

ブランド用のデュオトーンカラーはどう選びますか？

ブランドパレットから2色をサンプリングします。シャドウ用にはプライマリの暗いバージョンを、ハイライト用にはより明るい色（二次色やニュートラルなど）を使用するのが一般的です。同じペアでも異なるソーストーンでは挙動が異なるため、必ず実際の写真でテストしてください。コントラストを高く保つことが重要です。似た色の組み合わせは濁り、読みにくい結果になります。

A captivating portrait of a woman's face submerged in water with dramatic red and blue lighting.

画像クレジット

Duotoneのビフォー／アフター、カラーペア、ユースケース図 — 著者がポートレート写真（Pexels #5931195、August de Richelieuによる撮影）に2色ティントグラデーションを適用してデュオトーン効果を示すことで生成しました。