デザイン
カラーコンバーター
HEX・RGB・HSL間の色変換をリアルタイムで実行。ビジュアルカラーピッカーまたは値の直接入力に対応。
色を選択
カラースウォッチをクリックしてピッカーを開く。3つのフォーマット（HEX・RGB・HSL）が自動更新されます。
プレビュー
#3B82F6
各フィールドに直接入力することもできます。入力すると他のフィールドが自動更新されます。
#
color: #3b82f6;
color: rgb(59, 130, 246);
color: hsl(217, 91%, 60%);
重要な概念
16進数形式は、色を6桁の16進数（0〜9、A〜F）で表します。赤・緑・青の3ペアに分かれており、例えば
#FF0000は純粋な赤です。HTMLとCSSで最も広く使われている形式です。
RGB（Red, Green, Blue）は、赤・緑・青それぞれのチャンネルを0〜255の数値で表します。
rgb(255, 0, 0)は純粋な赤です。CSSでは透明度（アルファ）チャンネルを追加したrgba()も使用できます。
HSLは色をHue（色相, 0〜360°）、Saturation（彩度, 0〜100%）、Lightness（輝度, 0〜100%）で表します。人間が色を知覚する方法に対応しているため、手動で色を調整する際に最も直感的な形式です。
ブランドカラーの固定値（CSS変数・デザイントークン）にはHEXを使います。動的な透明度が必要な場合はRGB/RGBAを使います。カラーパレットを作成したり、色相・彩度・輝度をプログラムで変化させたい場合（テーマ生成・カラーバリアント）はHSLが最適です。