Webサイトの気になるカラーコードを取得「ColorZilla」

Webサイトを見ている時に、サイトカラーや画像の中で使用されているカラーなど、気になる色のコードを取得できるのが「Colorzilla」です。

Colorzillaの追加方法

ブラウザの拡張機能になります。以下のURLからブラウザに機能を追加できます。
Chrome(Colorzilla)
・Firefox(Colorzilla)

ColorZilla の使い方

ColorZillaをブラウザに追加できましたら、ブラウザの右上にあるスポイトアイコンをクリック。
開いたメニューの中の「Pick Color From Page」をクリックします。

ページ上部にバーが出てきます。
マウスカーソルが十字になりますので、取得したい色の上でクリックして取得します。
今回はYahooのロゴカラーを取得してます。
取得したカラーのコードは自動的にクリップボードへコピーされます。

過去に取得した色を確認することもできます。
ブラウザの右上にあるスポイトアイコンをクリック。
開いたメニューの中の「Color Picker」をクリックして確認できます。

この記事を書いた人
Yoshida

株式会社グロウニッチの制作を担当している吉田です。Web制作に関する記事やちょっと気になったものを紹介します。

関連記事

キャッシュデータは読み込みをサポートしてくれる機能ではあるものの、データが溜まっていくとパソコンの動作が遅くなりがちです。毎回、ブラウザの設定画面からキャッシュを削除しにいくのも面倒ですよね。もっと簡単にキャッシュを削除したい!そんな時に役……

サイト制作中にささっと色を探したいとき、色の指定をしたいときにGoogleドキュメントを使えば簡単に調べることが出来ます。また、フォントやオブジェクトにはめて確認したい時にイメージしやすいため便利です。 カラーコードの確認方法 ……

「Page Ruler Redux」はWebサイトで表示されている画像のサイズや任意の位置を測ることができるChromeの拡張機能です。 Page Ruler Reduxの追加方法 ブラウザの拡張機能になります。以下のURLから……

Google検索から、Web制作などで役立つカラーピッカーを簡単に利用することが出来ます。 Google検索で「カラーピッカー」と検索するだけ 検索結果ページの一番上にカラーピッカーが表示されます ①色相で選びたい……

AI ChatGPT Chrome Firefox flaticon GA4 Gmail Google Google Analytics Google Analytics 4 GoogleDocuments Google Gemini Google Hangouts Meet Google Meet GoogleWorkspace Google アナリティクス Googleカレンダー Googleスプレッドシート Googleドキュメント Googleフォーム Gsuite G Suite Hangouts Hangouts Meet LINE LINE公式アカウント Meet NotebookLM PCブラウザ QRコード Stripe WEB webサービス Webマーケティング Word Wordpress youtube ごあいさつ ご挨拶 アクセス解析 アンケート アンケートフォーム アンケート作成 オンラインマーケティング カラーコード カラーピッカー クレジットカード クレジットカード決済 グーグルワークスペース グーテンベルク コンソール サーバー ストライプ スペース セキュリティ テレワーク デザイン デジタルワークショップ ハングアウトMeet パスワード ビデオミーティング ビデオミーティングツール ビデオ会議 ビデオ会議ツール フォント ブラウザ ブログ ブロック マーケティング メール ユニバーサルアナリティクス ライン ライン公式アカウント リモートワーク レンタルサーバー ワードプレス 予約スケジュール 休業補償 会議ツール 便利機能 助成金 効率化 原稿 原稿作成 在ユニバーサル アナリティクス 在宅勤務 埋め込み 妊娠中 小技 投稿画面 拡張機能 新エディター 東京都 決済 無料 生成AI 管理画面 素材 著作権 集客

アーカイブ