注目度の高い記事
【超便利】ブログの配色どうしよう?迷った時に使えるサイトとchromeプラグインがこれ

 

わかば
ブログの配色をおしゃれにしたいんですけど
私センスがないから上手く決まらなくて・・・

山本
そんな時は Color Hunt というサイトがおすすめだよ

 

ブログの配色をおしゃれにしたい時に使えるサイト

WEB上のカラーコードを調べるときに便利な chromeプラグイン を紹介します。

 

1.相性のいい色のセットを探せる Color Hunt

高機能なワードプレステーマが増えてきたことによって

プログラムの知識がない人でも自分のブログを

手軽に理想的なデザインにすることができるようになってきています。

 

それ自体はとても嬉しいことなのですが、

色を指定できる箇所が多い分、配色に頭を悩ませてしまう事もしばしば・・・

 

「ブログの配色が中々思ったようにいかない・・・」

そんな時に参考にしたいのが Color Hunt というサイトなんです。

 

まずは Color Hunt のサイトに行って、どんなもんか見てみましょう!

 

外部リンクColor Hunt 公式サイト

 

Color Hunt の公式サイトにいくと、こんな感じで配色の見本がズラズラ―っと並んでいます。

 

配色パターンは数えきれないほどあるので

この中から好きなものを選んで、ブログの配色の参考にすることができます。

 

使いたいカラーパターンが決まったら、その色の上にマウスを持っていくと

下の図のようにカラーコードが表示されるのでわかりやすいですね♪

 

気に入った配色が見つかったら左下にある ハートマークのボタンをクリックしておくことで、

Likes(お気に入り) に保存しておくことができるのでこれも便利。

 

わかば
これだけ種類があったら好きな配色が見つかりそうです!

山本
そうだよね。僕もよく使わせてもらってるサイトだよ

 

2.WEB上のカラーコードを調べることができる ColorPick Eyedropper の使い方

自分のサイトで使っているカラーコードが知りたい場合を含めて

WEB上にあるすべてのカラーコードを即座に調べることができるのが

Google chrome の ColorPick Eyedropper というプラグイン。

 

山本
ColorPick Eyedropper は chrome 専用のプラグインです
別のブラウザをお使いの方は使用できませんのでご注意ください

 

カラーコードとは
WEB上で使われている色を指定するためのコードのこと。
#(シャープ)から始まる6ケタの英数字で表されます。

 

ColorPick Eyedropper を使うためには、

まずchromeにプラグインをインストールする必要があります。

 

chromeブラウザで公式サイトへいって chromeに追加 をクリックしましょう。

外部リンクchromeウェブストア

 

プラグインをインストールできたらブラウザの右上にアイコンが追加されます。

 

使い方は超カンタンで、カラーコードを調べたいページにいってから

プラグインのアイコンをクリックすると表示される十字カーソルを

コードを調べたい場所に持っていってクリックするだけ!

 

山本
試しに わー研。のヘッダーのカラーコードを調べてみました!

 

この場合だと FF715A の部分がわー研。のヘッダーのカラーコードという事になります。

 

後はこのカラーコードを入力したい場所にコピペするだけ!

お手軽に色を調べることができるので、すごく便利ですよ!

 

さいごに

相性のよい配色サンプルを手軽に検索できる Color Hunt と

WEB上のカラーコードを調べることができる chromeプラグインの使い方紹介でした!

 

どちらもすごく手軽に使えてしまうものなので

「色」で悩んだときはどんどん有効利用しちゃいましょう!

 

わかば
これで私でもおしゃれブログが作れそうです!
有用な情報、ありがとうございましたー!

山本
どういたしまして

 

ゼロから始める!ワードプレスブログ スタートマニュアル
ワードプレスブログスタートマニュアル

ブログには興味があるけど、ワードプレスってなんか難しそうだなぁなんて思ってませんか?

わー研。では、そんなあなたのために、手順通り進めるだけでワードプレスブログが開設できるマニュアル(特設ページ)をご用意しました!

もちろん無料で利用が可能ですので、はじめての方はぜひご活用ください!

Twitterでフォローしよう

おすすめの記事