画面カラーピッカーツール
画面や画像内の任意の位置の色をオンラインで取得し、HEX、RGB、HSL、CMYKなど複数形式での出力に対応。色の履歴記録とカラーパレットのエクスポート機能も提供します。
ブラウザ実行モード: データはブラウザ内で処理され、サーバーにはアップロードされません。
速度と安定性: 処理速度はデバイスとブラウザに依存します。大量のバッチ作業では、デスクトップ版の方が安定する場合があります。
ツールを読み込み中です。お待ちください...
ツールを読み込み中です。お待ちください...
オンラインツールを読み込めない、または実行できない場合は、デスクトップツールをお試しください。 https://tools.yikeaigc.com/
ツール使用状況
旧バージョンに戻す
ヒント:
先に取得元を選択し、出力設定を行ってから次の手順で色を取得してください。システム取得はデバイスのカラーピッカーを直接呼び出せます。画像取得と一括解析はすべてローカルで完了します。
取得元
入口を選んで開始。サンプル画像を読み込んで試すこともできます。
出力設定
設定を保存すると、次回自動で復元されます。
ヒント:
画像から色を取得するには、まず画像を選択し、画像上の対象ピクセルをクリックしてください。マウス移動時に拡大鏡と現在の座標が表示されます。複数画像では先頭20件のみ表示されますが、処理には全ファイルが含まれます。
画像色取得エリア
画像をアップロードするかサンプル画像を使い、画面をクリックして色を取得できます。
画像待機中
画像を選択するかサンプルを読み込んだ後、画面をクリックして色を取得します。
0,0
画像が未読み込みです
座標:-
現在の色
HEX、RGB、HSL、HSV、CMYK、LABに対応。
#2F80ED
白背景コントラスト:-
黒背景コントラスト:-
画像を一括処理
各画像のメインカラーを抽出し、ファイル名は元のまま保持します。
複数画像が未選択です
処理準備中
ヒント:
各形式の右側ボタンでコピーできます。JSON、CSS、ASEテキスト説明、SVGカラーチップのエクスポートも可能です。履歴はローカルに保存され、いつでも消去できます。
カラー形式
現在の色の開発・デザイン用定番形式。
履歴とパレット
色見本をクリックして色を再適用。
一括結果プレビュー
| ファイル | メイン色 | HEX | RGB | 状態 |
|---|
手順
ソフトウェアの使用方法
- 色取得元の設定:ツールを開いたら、まず画面から色を取得、画像から色を取得、または一括画像モードを選択し、必要に応じてHEXの大文字/小文字、出力精度、履歴数、一括主色数を設定します。
- よく使う設定の保存:「設定を保存」をクリックすると、現在の出力パラメータを記録できます。初期設定に戻す場合は「デフォルトに戻す」をクリックします。
- 画面から色を取得:「画面から色を取得」を選択後、「システム色取得を開始」をクリックし、対象位置をクリックすると色値を取得できます。現在のデバイスがこの機能に対応していない場合は、画像から色を取得する方法に切り替えてください。
- 画像から色を取得:
- 「画像を選択」をクリックしてローカル画像を読み込むか、「サンプルを読み込む」をクリックして操作を試すこともできます。
- 画像が表示されたら、対象エリアにマウスを移動して拡大鏡と座標を確認します。
- 対象ピクセルをクリックすると、ツールが対応するHEX、RGB、HSL、HSV、CMYK、LABなどの形式を生成します。
- 一括画像の主色分析:
- 「一括画像」をクリックして複数の画像を選択します。画面には最初の20個のファイルのみ表示されますが、残りのファイルも処理対象になります。
- 「一括分析を開始」をクリックすると、ツールが各画像から主色を抽出して結果を生成します。
- 処理完了後に「ZIPをダウンロード」をクリックすると、各画像に対応するJSONおよびCSS結果ファイルを取得できます。
- 結果のコピーとエクスポート:「コピー・エクスポート」ステップでは、特定の色形式を個別にコピーしたり、すべての結果をコピーしたり、JSON、CSS、SVGカラーチップ、パレットファイルとしてエクスポートできます。
- 色履歴の管理:色を取得するたびに履歴に追加されます。履歴の色ブロックをクリックすると、その色を再適用できます。保存する必要がない場合は「履歴をクリア」をクリックします。
よくある質問
A:現在のデバイス環境がシステムの色取得機能に対応していない、または色取得リクエストがキャンセルされた可能性があります。画像から色を取得する方法に切り替え、対象画面をスクリーンショットしてから画像をアップロードし、クリックして色を取得してください。
A:画像からの色取得では、クリック位置のピクセル色を読み取ります。色の見え方は画像圧縮、透明ピクセル、表示デバイスの色設定などの影響を受ける場合があるため、対象エリアを拡大してからクリックすることをおすすめします。
回答:HEX、RGB、HSL、HSV、CMYK、LAB、XYZ、CSS変数での出力に対応しており、Webページのスタイル、デザインカンプの注釈、ブランドカラーの整理、印刷用の色値の参考に利用できます。
回答:一括処理の結果は、できるだけ元の画像ファイル名を引き継いで、対応するJSONファイルとCSSファイルとして生成されます。同名のファイルがある場合は、既存の結果を上書きしないようにファイル名の末尾に数字が追加されます。
回答:カラー履歴は現在のデバイスに保存され、手動で削除するかサイトデータを消去しない限り保持されます。設定で履歴の保存件数を選択できます。
回答:いいえ。画像からの色抽出、一括メインカラー分析、パレットのエクスポートはすべて現在のデバイス上でローカルに完了し、画像ファイルがサーバーにアップロードされることはありません。