WebのカラーコードHEX・RGB・HSL
Web開発では色は主に3つのフォーマットで定義されます：HEX、RGB、HSL。このツールは任意の色を即座に3つのフォーマットに変換し、CSS名と補色も表示します。
HEXカラーコード
HEXはWebで最も一般的なカラーフォーマットです。#RRGGBBと書き、各ペアがチャンネル（赤・緑・青）の強度を00〜FF（0〜255）で示します。256値/チャンネルで16,777,216色をサポート。3桁省略形#RGBも有効：#F06→#FF0066。CSS（color: #FF5733;）、Figma、Photoshopなどすべてのデザインツールで使用されます。
RGBカラーモデル
RGB（赤・緑・青）はディスプレイの物理構造を反映します。各チャンネルは0〜255の値を取ります。CSSではrgb(255, 87, 51)または透明度付きrgba(255, 87, 51, 0.8)。
HSLカラーモデル
HSL（色相・彩度・輝度）はデザイナーに直感的です。色相（Hue）：0〜360°でカラーホイール上の位置。彩度（Saturation）：0%=グレー、100%=鮮やか。輝度（Lightness）：0%=黒、50%=通常、100%=白。明暗バリエーションの作成は輝度のみ調整すればよく、統一感のあるカラーパレット作成に最適です。
補色
補色はカラーホイール上で180°離れた位置にあり、最大コントラストを生み出します：赤↔シアン、緑↔マゼンタ、青↔黄。CTAボタン、データビジュアライゼーション、高コントラストUIデザインに活用されます。
Webアクセシビリティ（WCAG）
男性の約8%、女性の約0.5%が色覚異常を持ちます。WCAG 2.1 AAは通常テストに最低4.5:1のコントラスト比を要求します。色だけで情報を伝えることを避けてください。
CSS名前付き色
CSSは148の名前付き色（red、navy、coral、tealなど）を定義します。このツールは自動的に識別してCSS名を表示します。
プライバシー
すべての計算はブラウザ内で完結します。データはサーバーに送信されません。
コメント