平均色・代表色の抽出
Average & Dominant Colour
画像を代表する色を1つ、平均・中央値・最頻のいずれかで返します。
「この絵は何色か」には、それぞれ筋の通った答えが4つあり、その4つは食い違います。時にはかなり大きく食い違います。このツールは4つとも計算し、それぞれ何に向くのかを書きます。1つを選んで平均と呼ぶことはしません。
画像を置いてください
「この写真は何色か」への四つの答えと、その答えが食い違う理由です。
使い方
画像を置きます
デコードして標本を取り、測ります。出力ファイルは作りません。いま置いたばかりの絵をダウンロードする人はいないからです。
見本の色には代表色を使います
色空間の中でいちばん人口の多い領域を、その構成員の平均まで詰めたものです。4つのうち、画像が実際に多く含んでいる色であることが保証される唯一のものです。
背景には線形平均を使います
画像が放つ光の色なので、周囲の淡い光に合わせたり、画面の外へ絵を延ばしたりするときに合います。
よくある質問
2つの平均で色が違うのはなぜですか
sRGBのバイト値が光の量に比例していないからです。バイトを平均すると凹んだ曲線を通して平均することになり、結果が暗いほうへ引っ張られます。線形の光で平均して戻せばそうなりません。その差は数値で示しています。
平均が、写真のどこにもない灰色になります
大きく異なる2つの領域でできた絵に平均を取ると、そうなります。チャンネルごとで外れ値に強い中央値か、代表色を使ってください。どちらも、画像が実際に含んでいる色を返します。
色が1つでは足りません
配色抽出のほうが画像を量子化し、どの色がどれだけの割合を占めるかまで出します。テーマやグラフの目盛りを作るなら、そちらが正しい道具です。
ここから渡せます
画像から配色抽出
Palette Extractor
画像から代表色をN色抜き出し、HEX・CSS変数・ASEスウォッチとして書き出します。
BlurHash / ThumbHash 生成
BlurHash / ThumbHash
画像を短いBlurHashまたはThumbHashの文字列に符号化し、読み込み中の仮表示に使えるようにします。
PNG圧縮
PNG Compressor
パレットを量子化してdeflateストリームを書き直し、寸法を変えずにPNGを軽くします。
JPEG圧縮
JPEG Compressor
指定した画質でJPEGを再エンコードし、前後の容量と差分をその場で見せます。
次の一手
このツールが出したものをそのまま受け取れる道具です。
BlurHash / ThumbHash 生成
BlurHash / ThumbHash
画像を短いBlurHashまたはThumbHashの文字列に符号化し、読み込み中の仮表示に使えるようにします。
カラーコード変換
Colour Format Converter
HEX・RGB・HSL・HWB・LAB・LCH・OKLCHのあいだで色を変換し、いちばん近い色名も示します。
コントラスト比チェッカー
Contrast Checker
文字色と背景色の組み合わせをWCAG 2とAPCAで採点し、基準を満たす最も近い色を提案します。
画像から配色抽出
Palette Extractor
画像から代表色をN色抜き出し、HEX・CSS変数・ASEスウォッチとして書き出します。
カラーピッカー
Colour Picker
OKLCHの色域から、画面のスポイトで、またはアップロードした画像から色を選び、好きな表記でコピーします。
為替レート換算
Currency Converter
欧州中央銀行の日次基準レートでユーロを経由して約30通貨を換算し、銀行に言われたレートを自分で入れることもできます。