カラーピッカー
色を選ぶと、そのHEX、RGB、HSLの値がブラウザですぐに表示されます。
カラーピッカーの使い方
- カラースウォッチをクリックして、ブラウザのカラーピッカーを開きます。
- 色を選ぶか、カラーピッカーにHEX値を貼り付けます。
- 「実行」をクリックすると、その色のHEX、RGB、HSL値が表示されます。
カラーピッカーの仕組み
ブラウザのカラーピッカーが返すHEXコードを、ツールが赤・緑・青のチャンネル（各0～255）に分解してRGB値を求めます。次にRGBをHSLに変換します。明度は最も強いチャンネルと最も弱いチャンネルの平均、彩度は灰色からどれだけ離れているか、色相は色相環上の角度で、0°（赤）から120°（緑）、240°（青）へと進みます。
3つの形式はすべて同じ色を表し、CSSでは互いに置き換えて使えます。例：#3498DB、rgb(52, 152, 219)、hsl(204, 70%, 53%)。
よくある質問
- このツールは無料ですか？
- はい。アカウント登録なしで、無料で色を選んで変換できます。
- どの形式で表示されますか？
- 選んだ色のHEX、RGB、HSL表記を表示します。そのままCSSに貼り付けられます。