ForHosting KIT · 開発者向けツール

色を相対輝度順に並べ替え

順序が不揃いなHex色の一覧を、暗色から明色へ一貫して並ぶスケールに変換します。各値を検証し、短縮形と完全形のHex表記を正規化して、sRGBチャンネルを線形光へ変換したうえでWCAG相対輝度順に整列します。結果には正規化済みの色と輝度が含まれるため、見た目だけに頼らず僅かな差も確認できます。同じ輝度の色は元の順序を保ち、重複も残るので、同一入力から常に同一出力を得られます。

● Beta無料・ブラウザ内で実行

無料で実行 API仕様を見る

ご利用方法ウェブAPIメールTelegramアプリ近日

未整理のパレットから明暗スケールを作成します

色の一覧は、明るさではなくトークンの作成時期やファイルの保存順になっていることがあります。colors配列を渡すと、相対輝度の低いものから高いものへ並んだレコードを取得できます。3桁表記は6桁へ展開され、6桁表記では先頭の#を省略でき、出力は小文字の#rrggbbに統一されます。この正規化により、スナップショット、トークンファイル、CSS生成、実行間の比較が容易になります。重複は別のトークンを表す場合があるため削除しません。計算輝度が完全に同じ色は入力順を維持し、実行ごとの入れ替わりを防ぎます。応答には件数、方向、方式も含まれます。連続パレットの構築や隣接色の確認にご利用ください。ただし、色の補間やトークン名の変更は行わず、知覚的に均等な段階も保証しません。

相対輝度で順序が決まる仕組みをご確認ください

相対輝度は赤、緑、青のバイト値を単純に平均したものではありません。Hex色のsRGBチャンネルには非線形の伝達曲線が使われるため、各値を0から1へ正規化し、線形光へ変換します。sRGBの境界値以下では12.92で除算し、それを超える値には標準のべき関数を適用します。その後、0.2126、0.7152、0.0722の係数で合成します。緑の寄与が最大で青が最小となり、黒は0、白は1です。並べ替えには丸め前の完全な値を使用します。表示される小数6桁は読みやすさと安定したシリアル化のためであり、比較キーではありません。この方式はWCAGの計算にも使われますが、整列だけでアクセシビリティは証明できません。前景色と背景色の組み合わせごとに、別途コントラストを検証してください。

入力を検証し、決定的な結果を組み込めます

colorsフィールドには、1件以上1000件以下の配列が必要です。各要素は文字列で、任意の先頭#に続いて3桁または6桁の16進数字を指定します。値全体の前後空白は無視しますが、アルファ付き表記、CSS色名、rgb()関数、不正な長さ、文字列以外は拒否します。エラーには問題のある配列インデックスが示され、値を推測したり黙って除外したりしません。そのため、一部が欠落したもっともらしいスケールをビルドが受け入れることを防げます。処理はローカルな算術とメモリー内整列だけで、ネットワーク、時計、乱数、保存を使用しません。同じ配列はブラウザー、CI、APIで同じJSONになります。ブラウザーは無料で、APIリクエストは$0.002です。重複保持と安定した同順位処理により、元のメタデータへ確実に対応付けられます。

活用例

デザイントークンを整列

既存または生成済みの色を安定した順序に変換してから、スケール番号を割り当てられます。

連続グラフ色を準備

候補色を相対輝度順に並べ、視覚スケールの進行方向を一貫させられます。

パレットの推移を監査

正規化色と輝度を確認し、逆転、重複、または小さすぎる差を見つけられます。

よくある質問

APIリクエストの料金はいくらですか？

APIリクエスト1件は$0.002です。同じ決定的な処理をブラウザーでは無料で実行できます。

どの色形式を使用できますか？

#abc、abc、#aabbcc、AABBCCのように、任意の#を伴う3桁または6桁のHex色をご使用ください。

アルファ色やCSS色名に対応していますか？

いいえ。曖昧さを避けるため、アルファHex、色名、rgb()、hsl()などのCSS構文は拒否します。

2色の輝度が同じ場合はどうなりますか？

元の相対順序を維持します。この安定した規則により、重複も決定的に保持されます。

明暗順ならアクセシブルなコントラストになりますか？

いいえ。整列は個々の色を表すだけです。前景色と背景色の具体的な組み合わせを別途評価してください。

開発者向け — APIアクセス

このページの機能はすべてAPIからも利用できます。自社システムに組み込みたいチーム向けのセクションです。それ以外の方は上のツールをそのままお使いください。

エンドポイント

POSThttps://api.kit.forhosting.com/color/sort-by-luminance

Bearerトークンで認証し、POST1回でタスクをキューに登録します。結果はWebhookまたは署名付きリンクで受け取れます。

お使いのスタックから呼び出す

curl -X POST https://api.kit.forhosting.com/color/sort-by-luminance \
  -H "Authorization: Bearer $KIT_KEY" \
  -H "Content-Type: application/json" \
  -d '{"colors":["#f8fafc","#0f172a","#22c55e","#64748b"]}'

const res = await fetch("https://api.kit.forhosting.com/color/sort-by-luminance", {
  method: "POST",
  headers: {
    "Authorization": `Bearer ${process.env.KIT_KEY}`,
    "Content-Type": "application/json"
  },
  body: JSON.stringify({
    "colors": [
      "#f8fafc",
      "#0f172a",
      "#22c55e",
      "#64748b"
    ]
  })
});
const { task_id } = await res.json();

import os, requests

res = requests.post(
    "https://api.kit.forhosting.com/color/sort-by-luminance",
    headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
    json={
    "colors": [
        "#f8fafc",
        "#0f172a",
        "#22c55e",
        "#64748b"
    ]
},
)
task_id = res.json()["task_id"]

<?php
$res = file_get_contents("https://api.kit.forhosting.com/color/sort-by-luminance", false, stream_context_create([
  "http" => [
    "method"  => "POST",
    "header"  => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
    "content" => '{"colors":["#f8fafc","#0f172a","#22c55e","#64748b"]}',
  ],
]));
$task = json_decode($res, true);

body := bytes.NewBufferString(`{"colors":["#f8fafc","#0f172a","#22c55e","#64748b"]}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/color/sort-by-luminance", body)
req.Header.Set("Authorization", "Bearer "+os.Getenv("KIT_KEY"))
req.Header.Set("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)

リクエスト例

{
  "colors": [
    "#f8fafc",
    "#0f172a",
    "#22c55e",
    "#64748b"
  ]
}

レスポンス例

{
  "task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
  "type": "color.sort_by_luminance",
  "status": "queued",
  "_links": {
    "result": "/tasks/tsk_…/result"
  }
}

非同期APIです。task_idは即時に返ります。ポーリングは1秒あたり1リクエストまでです。

料金

1リクエストあたり$0.002

単価はすべて公開しています。トークン換算や独自クレジットはありません。失敗したタスクは課金されません。

制限

max_items 1000

エラー

HTTP	コード	意味
`401`	`unauthorized`	APIキーが無効か、指定されていません。Authorizationヘッダーを確認してください。
`402`	`insufficient_balance`	残高が不足しています。チャージ後に再度お試しください。
`404`	`unknown_type`	指定されたタスクタイプは存在しません。タイプ名を確認してください。
`429`	`rate_limited`	リクエストが多すぎます。しばらく待ってから再度お試しください。

KITの完全なドキュメントを見る →