本文へ移動
QKQuickKitEN
一般LOCALブラウザ内で処理

カラーフォーマット変換

CSS の色を sRGB 範囲で hex・rgb()・hsl() 間で変換します。alpha を保持し、CSS Color 4 の clamping に従います。

入力と主要な処理をブラウザ内で行い、その入力内容をQuickKitサーバーへ送信しない設計です。

仕組みと使い方

色を hex(#rgb, #rgba, #rrggbb, #rrggbbaa)、rgb()/rgba()、hsl()/hsla()、16 個の基本 HTML キーワード、または transparent で入力します。旧来のカンマ構文と新しいスペース/スラッシュ構文は CSS Color Module Level 4(2026-09-02 確認)に従って別々に検証します。旧来構文はカンマ区切りで、数値とパーセントの混在や none は不可。新構文は空白区切りで任意の `/ alpha` を持ち、単位の混在と none(0 として扱う)が可能です。パーセント指定のチャンネルに対応します。色相は <number> または <angle>(deg, grad, rad, turn)で、パーセント・未知の単位・非数値は 0deg として扱わず拒否します。数値は CSS Syntax の <number> 文法で解釈するため、JS 固有の表記(0x10, 0b10, Infinity, NaN)や不正な小数・指数(1., 1.e2, 1e, 1e+)は拒否し、数値と % / 角度単位の間に空白があるもの(50 %、10 deg)は別トークンになるため無効です。alpha の区切りがあるのに値が空(rgb(1 2 3 /)、rgb(1, 2, 3,))は無効です。仕様に従い、範囲外の値は拒否せず clamp します(r/g/b は 0–255、彩度・明度は 0–100%、alpha は 0–1)。色相は [0, 360) に正規化します。出力は hex・rgb()・hsl() で示し、alpha が 1 未満のときは 8 桁 hex と rgba()/hsla() 形式も表示します。変換は sRGB 範囲で行い、広色域・CIE 系関数(lab, lch, oklab, oklch, color(), hwb)は近似せず拒否します。出力は r/g/b を整数、色相・彩度・明度を小数第 2 位、alpha を小数第 3 位に丸めるため、繰り返し変換すると値がわずかにずれることがあります。