カラーホイール - HEX・RGB・HSL対応のインタラクティブカラーピッカー

カラーホイールをクリックして色を選択し、HEX、RGB、HSLの値を即座に取得します

カラーツール

Tool

Click to pick a hue

Brightness — 50%

Saturation — 100%

HEX

Quick Copy

HEX#ff0000

RGBrgb(255, 0, 0)

HSLhsl(0, 100%, 50%)

使い方

ホイールは色相の全360度をカバーする円錐グラデーションを描画します。ホイール上の点をクリックすると、ツールがCanvas APIを使用してその位置のピクセル色をサンプリングし、完全なHEX、RGB、HSL表現を計算します。

明度スライダーはHSLのLチャンネル（明度）を暗から明に調整します。彩度スライダーは色の鮮やかさを制御します — 0%は完全なグレー、100%はその色相の最も純粋なバージョンです。

はい。HEX入力フィールドは編集可能です。有効な6桁のHexコードを入力または貼り付けると、スウォッチが即座に更新されます。

使い方

1カラーホイールの任意の場所をクリックして色相を選択します

2明度スライダーを調整して色を明るくまたは暗くします

3彩度スライダーを調整して色をより鮮やかまたは落ち着いた色にします

4コピーボタンを使用して、結果のHEX、RGB、またはHSL値をコピーします

よくある質問

はい。HEX入力フィールドは編集可能です。有効な6桁のHexコードを入力または貼り付けると、スウォッチが即座に更新されます。