WEB業界で働く人や興味がある人に役立つ情報サイト“qam(カム)”

2020/05/28

Google Chromeで簡単にカラーコードを調べることができる拡張機能【ColorPick Eyedropper】

投稿者: とみー
カテゴリー: デザイン >WEBデザイン

はじめまして。
2020年4月に新卒入社した僕からWebに関する情報を、駆けだしだからこそ便利だと思えるツールやサービスを紹介していきたいと思います。
Web業界を目指している方やこれから勉強したいと思っている方々に少しでも参考になれば嬉しいです。

今回はとても便利なGoogle Chromeの拡張機能を紹介していきたいと思います。
デザイナーやマークアップエンジニアならWebサイトやバナーなどのカラーコードを知りたい時があると思います。
そんな時便利なのが、拡張機能「ColorPick Eyedropper」です。

ColorPick Eyedropperの導入方法

「Chromeウェブストア」にアクセス

「ColorPick Eyedropperにアクセスします。

「Chromeに追加」をクリック

Chromeウェブストアにアクセスしたら、右上にある「Chromeに追加」をクリックして下さい。

ColorPick Eyedropperの使い方

アイコンをクリック

「ColorPick Eyedropper」のアイコンをクリックします。

調べたい色にカーソルを合わせる

調べたい色にカーソルを合わせるだけで「#FFE8C0」だと分かりました。
調べたカラーコードをコピーしたい場合は、そのままクリックするだけでカラーコードが全選択されます。
選択されたら「Ctrl + c」でカラーコードがコピーできます。

まとめ

いかがでしたでしょうか。
すごく簡単にカラーを知ることができるので、デザイン時やコーディング時に重宝すると思います。
導入も簡単なので、ぜひ使ってみて下さい。

最後までお読みいただき、ありがとうございました。
よろしければシェアしていただければ幸いです。

  • このエントリーをはてなブックマークに追加

関連記事

よろしければこちらの記事もお読みください。

WEB業界ならqam!qam(カム)はWEB業界で働く人や興味がある人に役立つ情報サイトです。
マーケティングやデザイン、マークアップ(コーディング)、プログラム、トレンドなどの情報をqamライター陣が執筆。噛めば噛むほど(読めば読むほど)制作・開発や運営・運用、業界知識やノウハウを学ぶことができます。

トップへ