JA
マイツール

カラー反転(HEXカラーの反転)

HEXやRGBの色を反転(255 − 各チャンネル)したネガにしたり、ダークモード用にOKLCHで明度だけを反転したりします。スウォッチ付きの一括リストに対応します。

1行に1色(HEX、rgb()、hsl()、CSSの色名)、最大200色。
マイツール →
広告

色を反転するとは、写真のネガのように変えることです。RGBの各チャンネルが255から元の値を引いた値になるため、白は黒に、オレンジは青緑がかった青になります。このツールは色のリストをまとめて反転し、OKLCHで「明度だけ」を反転する、より賢い方法も用意しています。暗い色は明るくなりますが色相は変わらないので、ライトテーマをダークテーマにするときは、たいていこちらが求める結果です。

使い方

  1. 色を1行に1色ずつ貼り付けます。
  2. 色ごとに、単純な反転(各チャンネル 255 − 値)を確認します。
  3. 色相を保ったダークモード用の色が必要なときは、明度を反転した列を使います。
  4. 補色と比較し、変換前後の図をダウンロードします。

計算式

反転 = (255 − R, 255 − G, 255 − B) · 明度の反転 = OKLCH(1 − L, C, H)

単純な反転は色相と明度の両方を反転します。明度の反転は色相と彩度を保ち、知覚される明度だけを鏡映しにします。結果がsRGBの色域を外れる場合は彩度を下げます。補色(HSLの色相 + 180°)は色相を反転しますが、明度は保ちます。

計算例

トマト色 #FF6347 = rgb(255, 99, 71) を反転すると rgb(0, 156, 184) = #009CB8、ティール系の色になります。明度の反転は赤の色相を保ったまま暗い赤 #640000 になり、補色は明るいシアン #47E3FF です。中間のグレー #808080 は反転しても #7F7F7F とほとんど変わりませんが、OKLCHの明度60%は40%に反転して #484848 になります。

よくある質問

反転した色は補色と同じですか?

いいえ。反転は色相だけでなく明度も反転するため、明るい色は暗くなります。補色は、同じ明度のまま色相環の反対側にある色です。#FF0000のような純色で最も彩度の高い色では、たまたま両者が一致します。

グレーを反転してもほとんど変わらないのはなぜですか?

反転は各チャンネルを127.5を中心に鏡映しにするため、中間付近の色は中間付近にとどまります。#808080は#7F7F7Fになります。

画像を反転するには?

写真のすべてのピクセルに同じ255 − cの規則を適用する画像反転ツールを使うか、CSSのfilter: invert(1)を使ってください。

出典

最終更新:

このツールを引用する
APA

kakaoCalc. (2026, November 8). カラー反転(HEXカラーの反転). https://kakao.mobile/ja/tools/color-inverter/

MLA

“カラー反転(HEXカラーの反転).” kakaoCalc, 8 Nov. 2026, kakao.mobile/ja/tools/color-inverter/.

広告