カラー変換 — HEX / RGB / HSL / HSV を相互
HEX・RGB・HSL・HSV をリアルタイムに相互変換できるカラーピッカー付きツール。どの欄を編集しても他の 3 表記が即座に追従。すべてブラウザ内で動作し、入力した色情報は外部に送信されません。
使い方
ページ上部のカラーピッカーで色を選ぶか、HEX / RGB / HSL / HSV のいずれかの欄に値を直接入力してください。どれか 1 つを編集すると、残り 3 表記とカラーピッカー・プレビュースウォッチが即座に追従します。HEX は #RRGGBB と #RGB の両方を受け付けます。RGB は 0〜255、HSL / HSV の彩度・明度は 0〜100%、色相は 0〜360° の範囲です。各欄の右側にある「コピー」ボタンでその表記をクリップボードへコピーできます。書式が不正な欄は赤字でエラーを表示しますが、他の欄の表示は最後に成立した色を保持し続けます。
よくある質問
- 入力した色情報はサーバーに送信されますか?
- いいえ。色の解析・変換はすべてブラウザ内で行われ、ネットワーク通信は発生しません。
- RGB ↔ HSL ↔ HSV の変換式は何を使っていますか?
- 標準的な sRGB の幾何変換式 (Wikipedia の HSL and HSV の項に載っている定義) をそのまま実装しています。HEX から RGB へは 1 バイトの符号なし整数として解釈し、RGB を 0–1 に正規化したうえで HSL / HSV を算出します。
- アルファチャンネル (透明度) には対応していますか?
- 現在は対応していません。HEX は 6 桁 (または短縮 3 桁) のみ、RGB / HSL / HSV も 3 成分のみを受け付けます。需要が読めるアルファ対応はまだ調査中です。
- 丸めによってどのくらい誤差が出ますか?
- RGB は整数 (0–255)、HSL / HSV の角度・%は整数で四捨五入しています。RGB → HSL → RGB のラウンドトリップでは 0–1 程度の誤差が出ることがありますが、画面表示用途では肉眼で分からない範囲です。厳密な値を保持したい場合は HEX をマスタにしてください。
類似のツール
コントラスト比チェッカー — WCAG AA / AAA 判定
前景色 (文字色) と背景色を選ぶだけで、WCAG 2.x のコントラスト比を計算し、通常の文字・大きな文字・UI 部品それぞれで AA / AAA を満たすかをその場で判定します。HEX と rgb() 入力、カラーピッカー、ライブプレビュー付き。すべてブラウザ内で処理され、色情報は外部に送信されません。
画像カラーピッカー — HEX / RGB / HSL 取得
JPEG / PNG / WebP をアップロードし、画像内の任意の位置をクリックするとそのピクセルの色を HEX / RGB / HSL で取得できます。ホバー中はルーペで拡大表示し、ピックした色は履歴として一覧表示。各値はワンクリックでコピー可能です。画像は外部に送信されず、すべての処理はブラウザ内で完結します。
色温度 (Kelvin) ↔ RGB / mired 変換
光源の色温度 (Kelvin: 1000K〜40000K) を RGB / HEX / mired に変換し、白バランス・ホワイトポイント・室内光のシミュレーションに使える形にまとめます。Tanner Helland の sRGB 近似式を使用し、ろうそく (1500K)・タングステン (2700K)・暖色蛍光灯 (3000K)・昼光色 (5000K)・標準昼光 D65 (6500K)・くもり空 (8000K)・青空 (10000K) のプリセットを 1 クリックで読み込めます。逆方向は mired (1,000,000 / K) や RGB の rough 逆算もサポート。入力データはサーバーに送信されず、すべてブラウザ内で計算されます。
Base32 / Base58 エンコード・デコード
テキストを Base32 (RFC 4648 / TOTP 2FA シークレット) と Base58 (Bitcoin アドレス) で相互変換します。方式 (Base32 / Base58) と方向 (エンコード / デコード) を切り替え可能。UTF-8 バイト列ベースで日本語・絵文字も往復。すべてブラウザ内で処理されます。