カラー変換
HEX・RGB・HSL・OKLCH変換＋ピッカー・履歴。
⊕
カラーミキサー
2色を任意比率でブレンド（線形sRGB）。
100% A100% B
色 A
#000000
結果
#bcbcbc
色 B
#ffffff
HEX#bcbcbc
RGBrgb(188, 188, 188)
HSLhsl(0, 0%, 73.7%)
OKLCHoklch(79.52% 0 0)
混合は sRGB を線形化した空間（linear light）で行います。ガンマ空間での単純なチャンネル平均より、光の混ざりに近い結果になります。
カラーミキサーについて
カラーミキサーは、2つの色を任意の比率で混ぜて中間色を作るツールです。グラデーションの中間点や、ブランドカラー同士のブレンド、半透明オーバーレイの近似などに使えます。
toco.toolsでは色A・色Bと0〜100%の混合比スライダーから、結果スウォッチとHEX・RGB・HSL・OKLCHをブラウザ内で計算します。
重要なのは混合空間です。ガンマ補正済みのsRGBチャンネルをそのまま平均すると、黒と白の50%が#808080のように暗く濁って見えます。本ツールは各チャンネルを線形光（linear light）に戻してから補間し、再度sRGBにエンコードします。CSS Color Level 5の color-mix() を srgb-linear で行うのに相当する考え方です。
使い方
- 色 A と色 B を HEX・RGB・HSL で入力（またはピッカーで選択）
- 混合比スライダーで B の割合（0–100%）を調整
- 結果スウォッチを確認し、必要な形式をコピー
よくある質問（FAQ）
なぜ線形sRGBで混ぜるのですか？
ディスプレイに送るsRGB値はガンマ補正済みで、そのままチャンネル平均すると中間色が実際の光の混ざりより暗く濁ります。各チャンネルを線形光に戻してから補間し、再度エンコードすることで、黒と白の50%がより自然な中間グレー（#bcbcbc付近）になります。
混合比0%と100%は何を意味しますか？
0%は色Aのみ、100%は色Bのみです。スライダーの値は色Bの割合です。
アルファ（透明度）はどう扱われますか？
RGBは線形光で補間し、アルファは0〜1の線形補間です。結果はHEX（必要なら8桁）・RGBA・HSLA・OKLCHで出力します。
入力した色は外部に送信されますか？
いいえ。混合と形式変換はすべてブラウザ内で完結し、toco.toolsのサーバーへは送信されません。