画像から色コードを取得する

主な機能

• 11 × 11ピクセルのルーペ

  マウスを重ねるか、タッチ画面で押したまま動かすと、ルーペに11 × 11ピクセルのマス目が表示されます。取得する位置のピクセルには枠が付き、その下にHEXコードが出ます。パソコンではポインターの横、スマホでは指の上に出るので、隣のどのピクセルを選ぼうとしているかが見えます。

• 4つの形式を、行ごとにコピー

  取得した色は、HEXとRGB、HSL、それにCMYKの4形式で並び、行ごとにコピーボタンがあります。半透明のピクセルは、8桁のHEXに加えてRGBAとHSLAの値も表示され、不透明度がパーセントで書き添えられます。

• 直近の12色

  「最近の色」には、直近に取得した12色が残ります。保存されるのはHEXコードだけで、このブラウザの中に限られます。クリックすると呼び戻せ、コピーもでき、「消去」を押せば一覧が空になります。

• メインカラーと占有率

  パレットは、画像の代表色を5色から10色まで（初期値は6色）見つけます。それぞれに画像に占める割合が付き、パーセントの数字と、比例した長さの棒で表示されます。計算に使うのは、長辺を256ピクセルに縮めたコピーで、ほとんど透明なピクセルは無視されます。

• コードにもスライドにも使えるパレット

  CSS形式は:rootブロックで、--color-1、--color-2…と続き、各行の末尾にパーセントがコメントで付きます。PNGは色ごとに色見本を並べ、その下にHEXコードと割合を入れた画像で、ファイル名は元の名前に-paletteが付きます。

• 画面のどこからでも取得

  「画面から色を取得」は、スポイト機能を持つブラウザ（主にパソコン版のChromeとEdge）で使えます。開いた画像の中だけでなく、別のウィンドウやWebページなど、画面に見えているピクセルならどこでも選べます。画像を開く前にも使え、取得した色はほかの方法と同じように「取得した色」と最近の色の一覧に入ります。