Edited at

16進数カラーコードから補色を算出する

More than 1 year has passed since last update.


補色 とは

補色 - Wikipedia


補色(ほしょく、英: complementary color)とは、色相環 (color circle) で正反対に位置する関係の色の組合せ。相補的な色のことでもある。



要件


  • 手元にあるデータはカラーコードのみ。


    • 数百件ほど。



  • 全部の補色カラーコードを求める。


計算方法

参考にさせていただいたのは、反転色と補色を求める。で紹介されたAdobeのカラーの反転色または補色への変更という所。


カラーの各構成要素を、選択したカラーの最大の RGB 値と最小の RGB 値の合計を元にして、新しい値に変更します。現在のカラーの RGB 値のうち最大と最小の値が合計され、その値から各構成要素の値を引いて、新しい RGB 値が生成されます。例えば、RGB 値がレッド 102、グリーン 153、ブルー 51 であるカラーを選択したとします。この場合、まず最大値である 153 と最小値である 51 を合計して 204 という値が算出されます。この値から既存のカラーの RGB 値がそれぞれ差し引かれます。つまり、新しいレッドの値は 204 - 102(現在のレッドの値)= 102、グリーンの値は 204 - 153(現在のグリーンの値)= 51、ブルーの値は 204 - 51(現在のブルーの値)= 153 となり、新しい補色の RGB 値が生成されます。


この内容をPHPで書いたものがこちら。

// RGB値が、レッド102、グリーン153、ブルー51

$r = 102;
$g = 153;
$b = 51;

// 最大値である153と最小値である51を合計して204という値が算出される
$buf = max($r, $g, $b) + min($r, $g, $b);

// 上の値から既存のカラーのRGB値がそれぞれ差し引かれる
echo $buf - $r; // 102
echo $buf - $g; // 51
echo $buf - $b; // 153


まとめて処理するために

関数にしてしまう。カラーコードを渡せば補色が返ってくる。

// $code = getComplementary("#F1E2D3");

function getComplementary($masterCode) {
// 頭に#が付いたり付いてなかったりするので、無くす方向で統一
$masterCode = str_replace("#", "", $masterCode);

// 2文字ずつ取得(substr)し、16進数から10進数へ(hexdec)
$r = hexdec(substr($masterCode, 0, 2));
$g = hexdec(substr($masterCode, 2, 2));
$b = hexdec(substr($masterCode, 4, 2));

// 最大値と最小値の和を算出
$buf = max($r, $g, $b) + min($r, $g, $b);

// 補色のRGB値を計算し、16進数に変換(dechex)
$cr = dechex(($max + $min) - $r);
$cg = dechex(($max + $min) - $g);
$cb = dechex(($max + $min) - $b);

// 桁を揃えて結合
return sprintf("%02d", $cr) . sprintf("%02d", $cg) . sprintf("%02d", $cb);
}