カラーコードの検索・抽出に便利なGoogle拡張機能「ColorPick Eyedropper」

ウェブサイト上などにある色のコードを抽出するにはChrome拡張機能の「ColorPick Eyedropper」がおすすめです。

「ColorPick Eyedropper」の使い方

ColorPick Eyedropperにアクセス。「Chromeに追加」をクリックします。

確認用のポップアップが出るので「拡張機能を追加」をクリックします。

ブラウザ画面の右上にアイコンが追加されました。

アイコンをクリックすると以下のように表示されます。

知りたい色の上にカーソルを合わせます。

クリックすると以下のように表示されカラーコードが取得できます。

この記事を書いた人
Namiki

株式会社グロウニッチスタッフの並木です。好きな食べ物は梅干しです。

関連記事

Google GeminiとGoogleドキュメント連携で実現する、ビジネスの効率化と情報整理
Google GeminiとGoogleドキュメントの連携は、ビジネス現場における情報整理や業務プロセスの効率化を大幅に推進します。Business StarterからBusiness Standard以上のプランへアップグレードすることで、さらに高度な機能とセキュリティが実現可能です。ここでは、その具体的なメリットや活用シーンを分かりやすく解説します。 ……
Webサイトの気になるカラーコードを取得「ColorZilla」
Webサイトを見ている時に、サイトカラーや画像の中で使用されているカラーなど、気になる色のコードを取得できるのが「Colorzilla」です。 Colorzillaの追加方法 ブラウザの拡張機能になります。以下のURLからブラウザに機能を追加できます。・Chrome(Colorzilla)・Firefox(Colorzilla) Colo……
ワンクリックでキャッシュが削除できるGoogle Chrome拡張機能「Clear Cache」
キャッシュデータは読み込みをサポートしてくれる機能ではあるものの、データが溜まっていくとパソコンの動作が遅くなりがちです。毎回、ブラウザの設定画面からキャッシュを削除しにいくのも面倒ですよね。もっと簡単にキャッシュを削除したい!そんな時に役に立つGoogle Chrome拡張機能が「Clear Cache」です。 webサイト制作時には修正や更新の確……
Googleドキュメントを使ったカラーコード確認方法
サイト制作中にささっと色を探したいとき、色の指定をしたいときにGoogleドキュメントを使えば簡単に調べることが出来ます。また、フォントやオブジェクトにはめて確認したい時にイメージしやすいため便利です。 カラーコードの確認方法 ①文字を選択します②文字の配色アイコンをクリック ③カスタムの「+」をクリック ④選びたい……