色と補色の距離計算
色と補色の距離は、色相環で知られる関係を再現可能な測定値にします。16進数またはRGBの色をご入力ください。正確に180度離れたHSL補色を求め、両方をsRGBからCIELAB D65へ変換し、Delta E 76の距離を返します。正規化した調和度により結果を並べ替え、比較しやすくなります。また、元の色、補色、RGBチャンネル、16進コード、Lab座標から各処理を確認できます。不完全な値や範囲外の値は、暗黙に修正せず厳密に拒否します。
無料で実行
色を入力し、補色を一貫した方法で定義します
3桁または6桁の16進コード、rgb(r, g, b)式、あるいはコンマで区切った3つのRGBチャンネルとして色を送信してください。先頭のハッシュ記号や16進英字の大文字・小文字は結果に影響しません。RGBチャンネルは0から255までの整数でなければなりません。そのため、不正な構文、パーセント、小数、欠けたチャンネル、表示可能なsRGB範囲外の値は無効な入力として拒否されます。解析後、元のRGBチャンネルをHSLへ変換し、彩度と明度を保ったまま色相を正確に180度回転します。この定義はHSL色相環の古典的な反対点に相当し、明示されていない芸術的判断に依存しません。回転後のHSL値は、測定前に整数のsRGBチャンネルへ戻します。したがって、一般的な画面やCSSの処理で実際に表現できる色を対象にします。無彩色は重要な例外です。灰色の彩度はゼロなので、名目上の色相を回転しても見た目の異なる色は生まれません。補色も同じ灰色となり、測定距離はゼロです。ネットワーク、乱数、時計、プロファイル検索、隠れた状態を使わないため、同じ入力からは必ず同じ出力が得られます。
Lab距離と調和度の結果を読み取ります
応答には、正規化した元の色と補色を、大文字6桁の16進値、整数のRGBチャンネル、CIELAB座標で表示します。変換では、まず標準sRGBチャンネルを線形化し、標準のsRGB行列でCIE XYZへ写像し、sRGBが採用するD65基準白色を使用してから、CIELAB伝達関数を適用します。delta_e_76は2つのLab三つ組のユークリッド距離です。ゼロなら描画される色が一致し、値が大きいほど、このモデルでの知覚的な隔たりが大きいことを示します。この機能は業界固有の許容差重みを隠さず、1つの決定的な組を測るため、Delta E 76を意図的に採用しています。harmony_strengthは、Delta Eを2で割り、結果を100に制限して、距離を0から100の実用的な尺度に変換します。これは比較用の指標であり、美しさの普遍的な法則ではありません。ラベルによる区分は、15未満が弱い、15以上35未満が中程度、35以上65未満が強い、65以上が非常に強い、となります。彩度の高い補色は高得点になりやすく、穏やかな色や無彩色は低くなります。基礎測定値が必要な場合はdelta_e_76を保持し、ダッシュボード、フィルター、簡単なデザイン規則には得点やラベルをご利用ください。
デザインシステムで指標を適切に利用します
この計算機は、パレット生成、テーマ構築、グラフシステム、ブランドトークンの処理で、補色の16進コード以上の情報が必要な場合に役立ちます。一貫した規則で補色を導出し、生じる知覚的な隔たりで元の色を順位付けし、監査用にLab座標を生成トークンと保存できます。API料金は成功した項目ごとに$0.002で、ブラウザー実行では手早く対話的に確認できます。検証エラーにより、不正な色文字列がもっともらしいパレットデータになることを防ぎます。調和度とアクセシブルなコントラストを混同しないでください。Delta Eは色差を推定しますが、読みやすい文字には輝度コントラスト、文字サイズ、文脈の検討が必要です。非常に強い得点でも、特定のブランド、文化、画面状態、印刷工程への適合を保証しません。ここでは画面用sRGBを扱います。印刷色、特色、広色域値、測定試料を比べる前には、明示的に管理されたカラープロファイルが必要です。コントラスト、階層、彩度の均衡、人による確認と併用する一つの判断材料として結果をご利用ください。再現性が重要な場合はmethodフィールドも記録してください。HSL回転、CIELAB D65、Delta E 76という全経路を識別でき、CIE94、CIEDE2000、別の補色規則との混同を防げます。
活用例
生成したアクセント色を順位付け
各ブランド色と導出した補色を測定し、必要な知覚的距離を持つ組を優先できます。
デザイントークン生成を監査
正規化した16進値、RGB、Lab、手法、距離を保存し、後から補色トークンを再現して確認できます。
色の関係を教材で説明
同じ180度の色相回転を測定したとき、彩度の高い色と中立的な灰色が異なる理由を示せます。
よくある質問
補色はどのように計算しますか?
元の色をsRGBからHSLへ変換し、色相を180度回転します。彩度と明度を保ち、結果を整数のsRGBへ戻します。
Delta E 76は何を表しますか?
CIELABにおける元の色と補色の直線距離です。ゼロはLabの隔たりがないことを示し、値が大きいほどモデル上の知覚的な隔たりも大きくなります。
調和度はどのように求めますか?
Delta E 76を2で割り、結果を100に制限します。一貫した比較指標であり、美的品質を客観的に評価するものではありません。
高得点ならアクセシブルなコントラストになりますか?
いいえ。知覚距離と輝度コントラストは異なる問いに答えます。文字と画面のアクセシビリティにはWCAGコントラスト計算機をご利用ください。
APIでの計算料金はいくらですか?
正常に処理されたAPI項目ごとに$0.002です。無効な入力は範囲内へ暗黙に丸めず、明確に拒否します。
開発者向け — APIアクセス
このページの機能はすべてAPIからも利用できます。自社システムに組み込みたいチーム向けのセクションです。それ以外の方は上のツールをそのままお使いください。
エンドポイント
Bearerトークンで認証し、POST1回でタスクをキューに登録します。結果はWebhookまたは署名付きリンクで受け取れます。
お使いのスタックから呼び出す
curl -X POST https://api.kit.forhosting.com/color/complement-distance \
-H "Authorization: Bearer $KIT_KEY" \
-H "Content-Type: application/json" \
-d '{"color":"#336699"}'const res = await fetch("https://api.kit.forhosting.com/color/complement-distance", {
method: "POST",
headers: {
"Authorization": `Bearer ${process.env.KIT_KEY}`,
"Content-Type": "application/json"
},
body: JSON.stringify({
"color": "#336699"
})
});
const { task_id } = await res.json();import os, requests
res = requests.post(
"https://api.kit.forhosting.com/color/complement-distance",
headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
json={
"color": "#336699"
},
)
task_id = res.json()["task_id"]<?php
$res = file_get_contents("https://api.kit.forhosting.com/color/complement-distance", false, stream_context_create([
"http" => [
"method" => "POST",
"header" => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
"content" => '{"color":"#336699"}',
],
]));
$task = json_decode($res, true);body := bytes.NewBufferString(`{"color":"#336699"}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/color/complement-distance", body)
req.Header.Set("Authorization", "Bearer "+os.Getenv("KIT_KEY"))
req.Header.Set("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)リクエスト例
{
"color": "#336699"
}レスポンス例
{
"task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
"type": "color.complement_distance",
"status": "queued",
"_links": {
"result": "/tasks/tsk_…/result"
}
}非同期APIです。task_idは即時に返ります。ポーリングは1秒あたり1リクエストまでです。
料金
単価はすべて公開しています。トークン換算や独自クレジットはありません。失敗したタスクは課金されません。
エラー
| HTTP | コード | 意味 |
|---|---|---|
401 | unauthorized | APIキーが無効か、指定されていません。Authorizationヘッダーを確認してください。 |
402 | insufficient_balance | 残高が不足しています。チャージ後に再度お試しください。 |
404 | unknown_type | 指定されたタスクタイプは存在しません。タイプ名を確認してください。 |
429 | rate_limited | リクエストが多すぎます。しばらく待ってから再度お試しください。 |