ホーム 画像コントラスト

画像コントラスト

画像コントラストを強弱、強度調整可能——100% ブラウザ内で完結。

ソース

画像をここにドロップ

またはクリックして選択

.jpg.png.webp.gif.bmp

オプション

元の画像
調整後

画像コントラストとは?

画像コントラストは、写真の最明部と最暗部の輝度差を表します。高コントラスト画像は階調範囲が広く——深い黒、明るい白、明暗領域の強い分離——を持ちますが、低コントラスト画像は平坦に見え、階調が圧縮され中間調が濁ります。技術的には、コントラスト調整は各ピクセル値と階調スケールの中点(50% グレー)との距離をスケーリングします。コントラストを上げると値が中点から遠ざけられ(明るい所はより明るく、暗い所はより暗く)、下げると値が中点に近づけられ、より平坦で色あせた見た目になります。

コントラストは写真編集で最も影響力のある単一調整の一つです。すべての階調を一様に上下させる明るさとは異なり、コントラストはヒストグラム上の階調の広がりを変えます。「平坦」や「霧のように見える」写真は多くの場合コントラスト強化で救え、ハイライトやシャドウがクリップされて硬すぎる写真はコントラスト低下で柔らかくできます。本ツールは Canvas filter API を介してコントラスト変化を完全にブラウザ内で適用するため、写真はローカルで処理され、サーバーへアップロードされることはありません。

コントラストフィルタの仕組み

本ツールはブラウザ組み込みの ctx.filter = "contrast(N%)" プロパティを使って画像の階調範囲をスケーリングします。100% では画像は不変——これがスライダーの中性起点です。100% 未満の値はコントラストを下げ(50% は目立って平坦な画像、0% はすべてが均一な 50% グレーに崩壊)、100% 超の値はコントラストを上げます(150% は明確にパンチのある見た目、200% は階調を極限へ押し上げ)。操作はブラウザの最適化されたレンダリングエンジンで実行されるため、大きな画像でも実質瞬時です。

コントラストスライダーは結果の階調分離度を直接的かつ直感的に制御します。霞んだまたは低コントラストに見える写真には、115–130% 程度の値で自然な見た目が戻ることが多く、硬すぎる写真には 70–85% で柔らかくなります。極端な値(0% または 200% に近い)は特殊効果、グラフィックデザインのスタイリゼーション、または強烈な高コントラスト白黒変換に有用です。結果は選択に応じて PNG、JPG、WebP に再エンコードされます。

コントラスト値とその効果

コントラストスライダーの効果は予測しやすく、各ピクセルと中点との距離を同じ係数でスケーリングします。下表は各値域が画像に与える影響を示します:

効果典型的な用途
0%均一グレー特殊効果、完全フラット化
25–50%大幅に低下柔らかい、平坦、霞んだ見た目
70–90%わずかに低下硬い写真を柔らかく
100%変化なし——元の画像中性 / リセット
110–130%わずかに上昇平坦で霞んだ写真の補正
150–170%大幅に上昇パンチのあるグラフィックな見た目
200%最大コントラスト極端なスタイリゼーション、高コントラスト白黒

100% から始め、画像が良くなるまでスライダーを少しずつ動かします。変化が一様なため、通常は数回の試行で理想的な値が見つかります。

画像コントラストを調整するタイミング

画像が平坦、霞んでいる、または過度に硬いとき、コントラスト調整が正解です。よくあるシーンは以下のとおりです:

  • 平坦で霞んだ写真の補正。曇天や霧越しに撮影した際、コントラストを上げて被写体と背景の深度と分離を加えます。
  • 硬い写真の柔化。ハイライトがクリップまたはシャドウが潰れた写真はコントラストを下げて、より自然な階調バランスを回復させます。
  • ムード作り。高コントラストはドラマチックでシネマティックな見た目、低コントラストは柔らかく幻想的でヴィンテージな感触を生みます。
  • 印刷用画像の準備。印刷物は多くの場合コントラストを失うため、わずかなブーストがプレスのドットゲインを補償します。
  • スキャンの改善。古いスキャンや書類写真は多くの場合低コントラストで出力されます。コントラスト調整で文字とディテールが読める状態に戻ります。
  • グラフィックデザイン。高コントラスト版の写真は文字の背後の背景やスタイリズされたグラフィック要素として適しています。

写真が平坦、霞んでいる、または過度に硬く見えるときは常に、単一のコントラスト調整がパンチや柔らかさを与える最速の方法です。

画像コントラストの調整方法

本ツールでのコントラスト調整は数秒で終わり、すべてブラウザ内で完結します——アップロード不要、登録不要、透かしなし。ツールは画像をローカルでデコードし、Canvas API でコントラストフィルタを適用し、結果を必要な形式で出力します。次の手順で進めてください:

  1. 画像をアップロード。アップロードエリアをクリックするか、JPG・PNG・WebP・GIF・BMP ファイルをドラッグ&ドロップ。画像は即座にデコードされてプレビュー表示されます。
  2. コントラストを設定。0% から 200% のスライダーを使います。100% が元の画像、低い値はコントラストを下げ、高い値は上げます。
  3. 出力形式を選択。PNG でロスレス品質、JPG でより小さな写真、WebP でモダンなサイズと品質のバランスを選べます。
  4. コントラストを適用をクリック。ツールが画像を処理し、元と調整後のファイルサイズを並べて表示します。
  5. 調整後画像をダウンロード。「コントラスト画像をダウンロード」をクリックして結果を保存。元のファイルは変更されません。

すべてのステップは JavaScript でブラウザ内ローカルに実行されるため、画像がサーバーへアップロードされることはありません。これによりコントラストツールは完全にプライベートかつ高速で、機密画像にも適しています。

この画像コントラストツールは無料ですか?

はい、完全無料で登録・透かし・制限なしです。

100% コントラストとは何ですか?

100% は元の画像で変化なしです。100% 未満の値はコントラストを下げ、100% 超の値は上げます。

コントラストと明るさの違いは?

明るさはすべての階調を一様に上下させますが、コントラストは階調スケールの中点から明暗領域の距離を伸縮させます。

コントラストでクリップされたハイライトやシャドウは回復しますか?

いいえ。コントラストを上げるとすでにクリップされた値をさらにクリップへ押し込みます。クリップ領域を柔らかくするにはコントラストを下げますが、純黒や純白として記録されたディテールは回復できません。

画像はアップロードされますか?

いいえ。すべてローカル処理で、画像はブラウザから出ません。