入力
#FFFFFF
出力
#000000 / rgb(0, 0, 0)
デザインツール
カラー反転 - RGB 反転とダークプレビュー
各 RGB channel を 255 から引いて色を反転します。元色と反転色を比較し、サンプルレイヤーをプレビューしながら、ダークテーマ検討向けの CSS 変数スニペットを出力できます。
色反転ダーク
このツールをお気に入りに
お気に入りの保存方法がまだ選ばれていません。
クイック操作
このツールの URL をコピーするか、対応端末ではシステムの共有シートを開けます。
设计配色
カラー反転
#1
支持 #RGB、#RRGGBB 和 rgb(255, 255, 255)。
#000000
原始 RGB 255, 255, 255
反相 RGB 0, 0, 0
对比度 21.00:1
算法：每个 RGB 通道用 255 减去原值。例如 R(200) → R(55)。
<>
Original Inverted 利用シーン
- 明るい主色から反転した参照色を得る
- 反転後のコントラストを確認する
- 反転色を使った CSS 変数スニペットを出力する
使い方
- 基準色を入力または選択する（HEX / rgb）
- 反転結果と比較表示を確認する
- 反転値または CSS をコピーする
入出力サンプル
FAQ
反転色は補色と同じですか？
いいえ。このツールは各 RGB channel を 255 から引いています。補色は通常カラーホイール上の hue の関係で決まり、結果が異なることが多いです。
どの入力形式に対応していますか？
#RGB、#RRGGBB、rgb(r, g, b) に対応しています。無効な入力はエラー表示になり、結果は更新されません。
ツール
関連ツール
近い用途の翻訳済みツールへ続けて進めます。
カラーフォーマット変換
カラーフォーマット変換 - HEX、RGB、HSL オンライン
HEX、RGB、HSL、HWB、CMYK、CSS 変数のあいだで色をブラウザ内変換できます。カラーピッカーとランダムカラー補助も備え、デザインの引き継ぎ、スタイルシート作業、ブランドカラー整合に役立ちます。
カラー HEX RGB
CSS Filter ジェネレーター
CSS Filter ジェネレーター - ライブ画像エフェクト
blur、grayscale、contrast などの CSS filter 関数をライブプレビュー付きで組み合わせられます。スライダー操作だけで filter: blur(2px) grayscale(100%); のような stack を作成し、そのままコピーできます。
Design CSS Filter
パステルカラージェネレーター
パステルカラージェネレーター - 柔らかい低彩度パレット
柔らかいパステル調やモランディ風の配色をブラウザ内で生成できます。色数やスタイルを選び、残したい swatch をロックして、チャート、背景、やさしい UI テーマ向けに HEX 一覧や CSS 変数として書き出せます。
パステル パレット 色