カラーピッカー
クリックでコピー
R
0
G
0
B
0
使い方
- カラースウォッチをクリックしてブラウザのカラーピッカーを開きます。
- 「画面から色を取得」をクリックすると、画面上の任意のピクセルから色を取得できます。
- HEXコードを入力欄に直接入力することもできます。
- 選択した色がHEX、RGB、HSL形式で表示されます。
- 各値をクリックするとクリップボードにコピーされます。
カラー形式について
ウェブ上の色はいくつかの形式で表現されます。HEXは6桁の16進数コード（#RRGGBB）です。RGBは赤・緑・青の各成分（0〜255）で色を定義します。HSLは色相（0〜360°）、彩度（0〜100%）、明度（0〜100%）で表現し、人間の直感に近い色の調整が可能です。
主な用途
- ウェブサイトや画像、デザインモックアップから正確な色コードを取得する。
- CSS開発のためにHEX、RGB、HSLを相互変換する。
- ツールやプラットフォーム間でブランドカラーを統一する。
- 十分なコントラストを持つアクセシブルな配色を選択する。
- プレゼンテーションや資料に統一感のある配色を作成する。
ヒント
- スポイト（EyeDropper API）はChrome、Edge、Operaで利用可能です。
- HSL形式は手動調整が最も簡単です。色相で色、彩度で鮮やかさを変えられます。
- CSSやデザインツールでは最もコンパクトなHEX形式が広く使われています。
- RGBはプログラミングや画像処理ライブラリでよく使用されます。
プライバシー
すべての色処理はブラウザ内で完結します。データがサーバーに送信されることはありません。
よくある質問
「画面から色を取得」機能はどのブラウザで使えますか？
スポイト機能は EyeDropper API を利用しており、Chrome・Edge・Opera で利用できます。非対応のブラウザでは「このブラウザではスポイト機能は利用できません」と表示され、カラースウォッチや HEX 入力での色選択は引き続き使えます。
スポイトで取得した色やスクリーン情報はサーバーに送信されますか？
いいえ。EyeDropper はブラウザが取得したピクセルの色だけを返し、画面の内容も色の値もすべてローカルで処理されます。サーバーに送信されたり保存されたりすることはありません。
色はどの形式で表示されますか？
選択した色は HEX（#RRGGBB）、RGB（0〜255）、HSL（色相 0〜360°・彩度・明度）の 3 形式で同時に表示されます。各値をクリックするとクリップボードにコピーできます。
HEX コードを直接入力できますか？
はい。HEX 入力欄にコードを直接打ち込めば、その色がスウォッチに反映され RGB・HSL も同時に更新されます。既知のカラーコードから RGB や HSL を素早く調べたいときに便利です。
カラーピッカーとカラーコンバーターは何が違いますか？
このツールは画面から色を拾う（スポイト）ことと、選んだ色を 3 形式で確認・コピーすることに特化しています。アルファチャンネルや細かなスライダー調整が必要な場合は、カラーコンバーターの方が適しています。