サイト内や画像中のカラーコードを調べる方法３選
サイト制作などをしていると、画像に合わせたカラーコードを使いたい場面が出てきます。
ディベロッパーツール
サイト上のカラーコードなら、Chromeの拡張機能「ディベロッパーツール」で調べるのが正確です。
Windowsは「F12」、Macは「option ＋ command ＋ i」を押して起動します。
「選択ツール」（画像参照）をクリックして、見たいところを選ぶと、カラーコードを含めたコードが表示されます。
ここではカラーコードの調べ方だけを紹介しましたが、より詳しく知りたい方はディベロッパーツールの使い方をご覧ください。
画像カラーピッカー
画像からカラーコードを取得する方法です。画像中のコードはディベロッパーツールでは見ることができないので、こちらを使うと便利です。
このタイプのサイトはいろいろありますが、中でもこれが使いやすいかと思います。
任意の画像をドラッグ＆ドロップまたはURLで読み込むと、カーソルを当てた箇所のカラーコードが表示されます。
Mac純正カラーピッカー
Macには「Digital Color Meter」というカラーピッカー機能がついています。
「アプリケーション」もしくは「command ＋ space」で検索し、起動します。
最初の設定をします。ビュー→値を表示→「16進数（Hexadecimal）」を選びます。
任意の箇所にカーソルを当て、「command + shift + c」でコピーするとカラーコードをペーストすることができます。
一見、変に見えますが、ペーストすると#から始まるコードになるので大丈夫です（この場合は#60BDBBです）。
最後に
カラーコードを調べる方法まとめでした！
場面に応じて使い分けていたがくと良いかと思います。
それでは良いディベロッパー/ブロガーライフを😄