WordPress初心者さんのための、気になる！WEBサイトの配色を参考にしたい

最近WEB関連のお仕事が増えているのでたくさんのWEBサイトを見る機会が多く、「素敵な色使いだな・・・！」とクギ付けになることがあります。

皆さんもそのような経験はありませんか？

パクることはもちろんNGです！

ですが、配色を参考にするなら問題はないです。

そこで・・・！

気になったサイトの配色を、一瞬で解析できる方法をご紹介したいと思います！

それは、Chromeの拡張機能「ColorZilla」です。

ColorZillaでどんなことができる？

ColorZillaでは、配色のカラーコードを解析できます。

カラーコードとは、アルファベットと数字の羅列で出来た色を示すコードです。

アメブロをお使いの方も色付きの枠などを記事内に使うとき、カラー変更の際にカラーコードを使っているのではないでしょうか？

ColorZillaの使い方

導入方法は、通常のChrome拡張と同様でとても簡単です。

Chromeウェブストアから、拡張機能を導入するだけ！！

「Chromeに追加」ボタンをクリックし、後は画面に従っていくのみで使えます。

導入が正常に完了すると、PCのメニューバー（画面右上）にスポイトのアイコンが表示されます。

こんな感じ・・・↓

スポイトアイコンをクリックすると、一番上に「Pick Color From Page」があるので、そちらをクリック。

すると、画面の上にRGBとカラーコードが表示されます。

カーソルを動かしてみると、位置によって色が変化するのが確認できます。

あとは、解析したい配色の箇所をクリックするだけ。

これで、カラーコードを抜き取ることができます。

カラーコードは、すでにコピーされているので、あとは画像編集ツールのカラーコードを設定できる箇所に、コピペするだけ。

ぜひお試しあれ〜〜＾＾