カラーコードを一瞬して調べるツール「ColorPIck Eyedropper」についてご紹介します。
WEBサイトを閲覧していて、時々思う事があります。
このカラーって何色なのかな??どんなカラーコードを使っているのかな??って思う事があります。
自分でカラーコードのサイトをみて、一つ一つ調べていく方法もありますが、とてもじゃないけど大変。
そんな時に、役立つのが「カラーコード」を調べるツールです!!
とても便利なので気になる方はChromeに導入してみましょう。
何が便利かって、このツールは「調べたいカラーにマウスを当てるだけで、一瞬でカラーコード」を調べる事ができるんです!!
Chromeの拡張機能としては以前からあったツールなのですが、とても便利なのでここで紹介させていただきます。
使うためには、グーグルクロームに拡張機能を追加していく必要があります。
ColorPIck Eyedropperはカラーコードを調べたい時にとても便利
手軽にカラーコードを調べる事ができるChromeの拡張機能のツール「ColorPIck Eyedropper」はとても便利です。
どんな人に便利かというと??
・WEBサイトを作成していてデザインの参考にする時
・広告のカスタマイズをしている人
・ウェブデザイナーの人
・ヘッダーやアイキャッチでカラーを参考にしてデザインする人
・WEBサイトで使用しているカラーコードを気になる時に手軽に調べたい人
が対象になるかなって思います
まずは、グーグルクロームに「colorpick Eyedropper」ツールを、追加しましょう!!
Chromeに追加すると、colorfulなアイコンが表示されます「コレ」です!!
使い方はとても簡単なのです。
Chromeのブラウザを立ち上げると、上のマークがでてきますので、クリックします。
このアイコンをクリックして、ブラウザ上で調べたいカラーやロゴにマウスを当てるだけでカラーを調べる事ができます。
試しに、グーグルのアイコンマークで知られる「G」のマークでカラーコードを調べてみる事にします。
①グーグルのアイコンマークで、調べてみます。
・「赤の部分は何色のコードかな??」って思ってマウスをあててみます。
すると「♯EA4335」とでてきました。
この赤と同じ色を使いたい。と思った時は、これでコードを調べてると、同じ色を使う事ができる。という事がわかります。
ちょっとした同じような赤でも、コードが違っていたりするので、大変便利だと思います。
②グーグルのアイコンマークで調べます。
・「緑色の部分は何色のコードかな??」って思ってマウスをあててみます。
すると、「♯34A853」とでてきました。
この緑色のカラーを使いたいと思った時は、このコードを使う事で使えるんだ。と理解してください。
使い方は色々あるよね!!
このツールをChromeに導入するだけで、こんなカラーコードを一瞬に調べる事ができます。
はい、とても便利ですね。
一つ一つカラーコードを調べる方もいると思いますが、とにかく簡易的に的確なカラーを調べるならこの方法が一番効率的!!
カラーコードは一つづつ調べてもいいと思います。全く同じカラーにしないにせよ、似たような雰囲気のカラーを探した時にもこちらの、HTMLカラーチャートは参考になります。
もう一度「ColorPIck Eyedropper」は、どんな人に便利かというと、、、、
だと思います。(繰り返しになりますが。)
※Chromeを使っていない人はChromeを使う必要があります。
まとめ
デザイン系の仕事をされている方は、知っているツールかなって思いますが、デザイン系の仕事だけではなく、色んな活用方法があるかと思います。
WEBサイト所有者やカラーを参考にしたい人。にとってはとても便利なツールになるかなって思います。オシャレなカラーというのはたくさんありますが、実際にはどのカラーを使っているかというのは、微妙に違ったりしていますので、自力で同様のカラーを探すのは大変なのです。
参考にしてみてくださいね。