ピクセルをクリックして値を読み取ります

カラー ピッカーは、クリックしてピクセルのカラー値を読み取る対話型の表示機能です。エクスポート ファイルは生成されず、「バッチ」の概念はありません。アップロードされた画像がどれほど大きくても、特定の場所を 1 つずつクリックして色を読み取るため、このツールは単一画像のアップロードのみをサポートし、バッチ モードは提供しません。

現在お使いの端末のブラウザ上で完全に完結します。ブラウザーのネイティブ Canvas ピクセル読み取り機能を利用すると、元の画像をサーバーにアップロードすることなく、対応する位置のカラー値が画像データから直接読み取られます。

虫眼鏡に表示されるのは、カーソルの現在のホバリング位置の周囲の小さな領域の拡大効果です。実際に取得されるのは、赤いボックスでマークされた特定のピクセルの色です。画像自体にグラデーションやノイズがある場合、隣接するピクセルの色はわずかに異なります。赤いボックスでマークされたピクセルに基づいてクリックして選択する限り、色は正確に対応し、ずれはありません。

選択履歴は現在のページのブラウザーのメモリにのみ保存されるため、同じ操作で選択した複数の色を比較できます。履歴はページを更新するかページを閉じると消去され、永続的に保存またはアップロードされることはありません。特定のカラー値を長期間保持する必要がある場合は、最初にそれをコピーして自分のノートまたはデザイン ツールに貼り付けることをお勧めします。

HEX (#FF3B30 など) は、Web 開発およびほとんどのデザイン ツールで最も一般的に使用される形式です。シンプルで貼り付けも使用も簡単です。赤、緑、青の 3 つのチャネルの値を個別に調整する必要がある場合は、RGB (rgb(255, 59, 48) など) の方が直感的です。 HSL (hsl(4, 100%, 59%) など) は、色相、彩度、明度に従って色を記述します。これは、同じ色相に基づいて深度または彩度を調整する必要がある場合に便利です。 3 つの形式は同じ色を表します。実際に貼り付けたいツールやコードに応じて、対応する形式を選択するだけです。

できる。カラーピッカーは画像をデコードした後に元のピクセルデータを読み込みます。これはページの表示サイズに影響されません。画像が縮小されてページ上に表示された場合でも、対応する位置のピクセルの色は、ピックアップ時に画像自体の実際の解像度に従って正確に読み取られ、ズーム表示による色のずれは発生しません。