Macで画面の色（カラーコード）を調べる方法
Macで画面の色を調べるなら、最初から入っている「Digital Color Meter」が使えます。開いて、調べたい場所にポインタを置くと、その場所の色の値がすぐに表示されます。Webやデザインで使う「#1E90FF」のようなHEXのカラーコードが欲しいときは、スポイトでクリックするだけでコピーできるアプリを使うと早く済みます。
Digital Color Meterで色を調べる手順
- Finderで「アプリケーション」›「ユーティリティ」›「Digital Color Meter」を開きます。
- 調べたい色の上にポインタを置きます。ウインドウに拡大表示とRGBの値が出ます。
- HEXで見たいときは、「表示」メニューで値の表示を16進数に切り替えます。
- ⇧⌘Cを押すと、表示中の色の値がテキストとしてコピーされます。
ポインタを動かすと値も変わるので、狙った色で止めるには⌘Lで表示を固定してからコピーします。
スポイトでクリックしてHEXをコピーする（SimpleShot）
- ⇧⌘4を押し、画面上部のスポイトボタンを押すか、Iキーを押します。メニューバーのSimpleShotから「カラーを取得」を選んでも始められます。
- ポインタの周りが拡大され、ピクセル単位で色とHEXの値が表示されます。
- 欲しい色の上でクリックします。カラーコード（#から始まるHEX）がクリップボードにコピーされます。
- デザインツールやCSSに⌘Vで貼り付けます。
値はWebやデザインツールで使われるsRGBのHEXで、MacBookの画面の色空間（Display P3）から変換したものです。範囲を選んでいる最中にCキーを押しても、ポインタの下の色をコピーできます。色を調べるだけで、画面が保存されたり送られたりすることはありません。
よくある質問
Macにスポイトツールは標準でありますか？
「Digital Color Meter」が標準で入っています。「アプリケーション」›「ユーティリティ」にあります。
Digital Color Meterの値とWebの色が合いません。
表示する色空間が違うと値も変わります。Digital Color Meterで表示する色空間をsRGBにすると、Webで使う値に近くなります。
スポイトで取った色をショートカットで呼び出せますか？
SimpleShotでは、「カラーを取得」に好きなキーを割り当てられます（最初は割り当てなし）。⇧⌘4のあとIキーでも使えます。
更新日：
関連記事
色をクリックして、
カラーコードをそのまま貼り付け
無料 · macOS 26以降 · Appleシリコン