【Mac】Digital Color Meterを使って、画面に表示されている色をHEX値で取得する

10-10-2021

画面に表示されている色をカラーコードとして取得するためにカラーピッカー用のアプリをインストールして使っていたが、Macのデフォルトアプリだけで十分取得できた

今回は、その方法についてまとめる

Digital Color Meter を起動する

Macにはデフォルトでインストールされた Digital Color Meter というアプリがある

default-app-digital-color-meter

このアプリを起動すると、以下のようなUIが表示される

launched-ui

基本的な使い方は、画面に表示されているピクセルにマウスのカーソルを当てることで、その色情報が確認できる

HEX値として取得するための設定をする

今回は、色情報をHEX値として取得することが目的なので、アプリ内で以下の設定をする

まず、画面上でやることは、プルダウン式のオプションから 汎用のRGBで表示 を選択する

select-general-purpose-rgb

次に、メニューバーの 表示 > 値を表示 > 16進 を選択する

hexadecimal-number

これでHEX値を取得する準備は完了になる

取得後、確認する

上記の準備ができたら、取得したい色のピクセルにカーソルを当てて、 Command + Shift + C を入力することでその色のHEX値が取得できる

以下は、このブログのバッジにある色のHEX値を取得するときの例になる

get-hexadecimal-number

このようにカラーコードでも使うHEX値が取得できる

さいごに

ブラウザとか単体のアプリとかでカラーピッカーを選ぶのに悩むことがあるけど、シンプルにHEX値を取るだけならこの方法で十分だと思った