福岡のIT系の会社で働くエンジニアのブログです。

技術雑記

【Mac】Macで画面内の色のカラーコードを簡単に調べる方法【カラーピッカー】

Twitter bookmark Facebook LINE Pocket Feedly RSS

画面に表示されている画像の色のカラーコードを知りたい!

頻繁にはないのですが、たまに画面に表示されている色のコードを取得したい時ってありませんか?

とくにCSS触っていたりするときなんかに・・・。

なんか使えそうなソフトを探そうとしたらMacの標準アプリで簡単に取得できたのでそのメモです。

 

Digital Color Meter を使ってカラーコードを取得

Spotlight(スポットライト)だと、Digi とか入力するとすぐ見つかります!

Launchpad(ランチパッド)だと、「その他」のフォルダに入っています。

 

起動するとこんな感じです。

command ⌘ + shift ⇧+ C と押すと、マウスカーソルの位置のカラーを取得できます。

command ⌘ + L で 取得する位置をロックできます。

 

マウスで対象の画像やアイコンの箇所にマウスをあてて、command ⌘ + shift ⇧+ C と押すとクリップボードにカラーコードが保存!

使ってみよう!

実際に取得して、エディタなんかに貼り付けると

92    153    220   

とかになってて、うーん。

#ffbbcc みたいな形式で取得したい

そんなときは、「表示」メニュー、「値を表示」→「16進数」を選択

 

「ネイティブの値を表示」を「汎用のRGBで表示」に変更

その後再度カラーを取得すると、

#74EB4C

と見事に期待通りのカラーコードが取得できました!

(もちろんもともとのRGB10進数で取得したいときは設定変更は不要ですよ。)


ちょっとしたことでしたが、意外と気が付かないMac標準アプリの紹介でした。

Twitter bookmark Facebook LINE Pocket Feedly RSS