Macの画面のどこかから、色を拾って使いたい。デフォルトで入ってるカラーピッカーが便利

以前こんな風に

CSSいじった現在

左側にインデックスのようなボックス+下線の組み合わせで小見出しを装飾する方法の記事を書いたのですが、

子テーマとか全然わかってない私が、CSS で h3 と h4 を装飾してみた | くにぽん’ず★きちめきパラダイス

あれからだいぶ時も経ち、別途プラグインを入れなくてもJetpack さえ入れとけば同じ機能を果たしてくれる時代になったので、改めて小見出しを装飾してみました。

「外観」メニューに統合されてる

Jetpack を導入していれば「外観」メニュー直下に「CSS編集 」と言う項目があります。

CSS スタイルシートエディター

/* 茶色い字で書かれてる部分 */ は、消しちゃって大丈夫です。

カラーコードを知りたい!

今回施したのは冒頭記事で紹介したものと同じ装飾ですが、そのまま使うと以前使ってたテーマに合わせた色のせいで統一感がなくなるので、手っ取り早くこのブログのメニューバーから色をピックアップすることにしました。

ソースコード見りゃわかるのですが、該当箇所を探すのが面倒だったので、ここはコレの出番です。
DigitalColor Meter

「でじたるからーめーたー!!」(何となくドラえもんの声で)

Launchpad(銀のロケット)の「その他」フォルダに入ってます。
デフォルトだと10進法になってるので、メニューの「表示 > 値を表示 > 16進」にチェックを入れます。

あとはマウスのポインターを欲しい色のところに持って行って、

DigitalColor Meter ピックアップ完了

こんな風に枠の中にターゲットの色が表示されたら
⌘コマンド+⇧シフト+ C
でクリップボードにカラーコードがコピーされます♪
この場合だと#75B8EDですね。

使っているアプリケーション問わず使えるので、便利ですよ。