画像色調整(明るさ・トーンカーブ・グラデーションマップ)

画像の明るさ・コントラスト・彩度・色相・ホワイトバランスをスライダーで調整し、トーンカーブやグラデーションマップで本格的な色補正・色加工ができる無料ツールです。複数枚をまとめて読み込んで、同じ調整を全画像に一括適用(ZIP保存・フォルダへの直接保存)もできます。TGA形式の読み書きにも対応。処理はすべてブラウザ内で完結し、画像が外部に送信されることはありません。

1. 画像(複数可)

ここに画像をドロップ / クリックで選択(複数可)
(Ctrl+V での貼り付けも可。TGA形式にも対応しています)

2. プレビュー

プリセット
基本調整
ホワイトバランス
RGBチャンネル
トーンカーブ

クリックで点を追加、ドラッグで移動、ダブルクリックで点を削除。背景は選択中の画像の輝度ヒストグラムです。

グラデーションマップ

画像の明るさをグラデーションの色に置き換えます。丸いつまみをドラッグして位置を調整できます。

3. 書き出し

画像色調整ツールについて

画像の色をブラウザだけで調整できる無料の色調補正ツールです。明るさ・コントラスト・彩度・色相・ガンマの基本調整、色温度と色かぶりを整えるホワイトバランス、レッド・グリーン・ブルーの各チャンネル調整に加えて、画像編集ソフトでおなじみのトーンカーブとグラデーションマップを搭載しています。写真の色味の補正はもちろん、イラストの仕上げ調整、ゲーム用テクスチャの色替え、セピア・青焼き・シネマ風といった雰囲気づくりまで、この1ページで完結します。

トーンカーブは、横軸が元の明るさ・縦軸が変換後の明るさを表すグラフで、曲線を持ち上げると明るく、下げると暗くなります。RGB全体に効くカーブとR・G・B個別のカーブを別々に編集でき、S字カーブでコントラストを付けたり、シャドウ部だけ青を足すといった細かな追い込みが可能です。カーブの背景には選択中の画像の輝度ヒストグラムが表示されるので、画素がどの明るさに集中しているかを見ながら調整できます。グラデーションマップは、画像の明るさを指定したグラデーションの色に置き換える加工で、モノクロ化・セピア・ティール&オレンジのような映画風の色づくりに使えます。適用度スライダーで元の色と混ぜられるため、うっすら色味を乗せる使い方もできます。

複数枚の画像をまとめて読み込めば、同じ調整を全画像に一括適用できます。連番イラストやテクスチャセット、写真セットの色味をそろえたいときに、1枚で調整を作り込んでから残りへ一括適用する、という流れで使えます。保存はダウンロード(複数枚はZIPにまとめて1ファイル)のほか、保存先フォルダを指定して1枚ずつ直接書き込む方式(Chrome・Edge)も選べます。読み込みはPNG・JPEG・WebP・BMP・GIFなどブラウザが表示できる形式に加えて、ゲーム開発などで使われるTGA形式(RLE圧縮対応)にも対応。書き出しはPNG・JPG・WebP・TGAから選べます。

プリセットには「ビビッド」「モノクロ」「セピア」「ふんわり」「ビンテージ」「シネマ」「青焼き」などを用意しており、ワンクリックで適用してから各スライダーで微調整できます。「長押しで元画像と比較」ボタンで調整前後をすばやく見比べられます。読み込み・調整・書き出しはすべてお使いの端末内で処理され、画像がサーバーにアップロードされることは一切ありません。

使い方

  1. 「1. 画像」の枠に画像をドラッグ&ドロップするか、クリックしてファイルを選択します(複数選択可)。コピーした画像を Ctrl+V(Macは⌘+V)で貼り付けることもできます。
  2. 右側のパネルで色を調整します。まずプリセットで方向性を決めてから、基本調整・ホワイトバランスのスライダーで微調整するのがおすすめです。細かく追い込みたいときはトーンカーブを、色の置き換えにはグラデーションマップを使います。スライダーはダブルクリックで初期値に戻せます。
  3. 「長押しで元画像と比較」ボタンを押している間は元画像が表示されるので、調整の効き具合を確認できます。複数枚のときは一覧の画像をクリックするとプレビュー対象を切り替えられます。
  4. 「3. 書き出し」で保存形式(PNG・JPG・WebP・TGA)を選び、「この画像を保存」または「全画像に適用して一括保存」を押します。複数枚の一括保存はZIPファイルにまとまります。「保存先」で「フォルダを指定」を選ぶと(Chrome・Edge)、選んだフォルダへ1枚ずつ直接保存できます。

よくある質問

画像はアップロードされますか?
いいえ。読み込んだ画像の調整・書き出しはすべてブラウザ内(お使いの端末内)で行われ、当サイトを含むどこにも送信・保存されません。ページを閉じると調整内容も消えるため、必要な画像は保存してください。
対応している画像形式は?
読み込みはPNG・JPEG・WebP・BMP・GIF(先頭フレーム)など、お使いのブラウザが表示できる形式と、TGA形式(無圧縮・RLE圧縮、8/15/16/24/32bit、カラーマップ対応)です。書き出しはPNG(透過保持)・JPG(品質指定可)・WebP・TGA(RLE圧縮・透過保持)から選べます。WebPの書き出しはブラウザが対応している場合のみ選択できます。
複数枚にまとめて同じ調整をかけるには?
ファイル選択やドロップで複数枚をまとめて読み込み、1枚をプレビューしながら調整を作ってから「全画像に適用して一括保存」を押してください。すべての画像に現在の調整がそのまま適用され、「元ファイル名_adj.png」のような名前(接尾辞は変更可)でZIPファイルにまとまります。なお変換は原寸で行うため、巨大な画像を大量に読み込むと時間がかかることがあります(ZIPは合計4GBまで)。
保存先のフォルダを指定できますか?
できます。「保存先」で「フォルダを指定」を選び、「📁 フォルダを選ぶ」でパソコン内の保存先フォルダを選択してください(保存ボタンを押したときに選ぶこともできます)。フォルダ指定時は、複数枚でもZIPにまとめず1枚ずつ直接保存されます。同名ファイルがある場合は既定で「 (2)」のような連番を付けて保存し、「同名ファイルは上書きする」をオンにすると上書きします。この機能はFile System Access APIを使うため、対応ブラウザはChrome・Edgeなどです(Firefox・Safariでは選べません。ダウンロード保存をご利用ください)。フォルダの指定はページを再読み込みすると解除されます。ファイルの書き込みもブラウザ内で完結し、画像が外部へ送信されることはありません。
トーンカーブの使い方がわかりません
グラフの左下が暗い部分(シャドウ)、右上が明るい部分(ハイライト)です。線の上をクリックすると制御点が追加され、ドラッグで動かせます(ダブルクリックで削除)。中央を少し持ち上げると全体が明るく、S字(左下を下げて右上を上げる)にするとコントラストが強くなります。上部のRGB・R・G・Bタブでチャンネルを切り替えると、たとえばBカーブの左側を持ち上げて「シャドウにだけ青を足す」といった色調整ができます。
グラデーションマップとは何ですか?
画像の各画素の「明るさ」を、指定したグラデーション上の色に置き換える加工です。暗い部分がグラデーションの左端、明るい部分が右端の色になります。白黒のグラデーションならモノクロ化、茶系ならセピア、暗部を青緑・明部をオレンジにすると映画のカラーグレーディング風になります。つまみのドラッグで位置、色ボタンで各ストップの色を変更でき、「適用度」を下げると元の色と混ざるので、薄く色味を乗せる使い方もできます。
調整はどの順番で適用されますか?
RGBチャンネル・ホワイトバランス → 明るさ → コントラスト → ガンマ → トーンカーブ(RGB→各チャンネル) → 彩度・色相 → グラデーションマップ、の順で適用されます。プレビューと保存結果は同じ処理なので、見たままの色で書き出されます。
プレビューと保存された画像で違いはありますか?
色の変換内容は同じですが、プレビューは動作を軽くするため長辺1400pxに縮小した画像で表示しています。保存時は元の解像度のまま全画素に調整を適用するため、画質が落ちることはありません。
JPGで保存すると透明部分はどうなりますか?
JPGは透明を扱えない形式のため、透明部分は白で塗りつぶされます。透過を保持したい場合はPNG・WebP・TGA(32bit)で保存してください。
TGA形式とは何ですか?
ゲーム開発や3DCG制作でテクスチャによく使われる画像形式です。このツールは読み込み(無圧縮・RLE圧縮、カラーマップ、8〜32bit)と書き出し(RLE圧縮、アルファがある場合は32bit・ない場合は24bit)の両方に対応しているので、TGAテクスチャの色調整をブラウザだけで完結できます。
大きさの上限はありますか?
入力はブラウザのcanvas上限(多くの環境で長辺16384px程度)までです。大きな画像の一括保存では、1枚ごとに原寸で変換するため数秒かかることがあります。