Coolorsでブログのカラーカスタマイズ

最近また新しくブログを作ってしまいました。
ブログを作る時も、新しい動画シリーズを作るときも、最近私はまず最初にカラーパレットを作ります。
作っている最中に悩むことなく、最初のイメージ通りに完成させられるので、文字通り自分の独自カラーを出したい方にはこの方法お勧めします。

カラーパレットの作り方なのですが、今はいろいろとWeb上で使えるツールがありますよね。
多くの場合、そのツールでユーザーが作ったパレットが公開されているので、そこから選んでもいいのですが、私はオリジナルにこだわるのでゼロから作ります。
いくつか試した中で使いやすかったのがCoolorsです。作って出力するだけならサインアップは不要ですぐに使えます。

では私流の手順を解説しますね。

Coolorsによるブログ用カラーパレット作成

1. まず、イメージカラーを決めます。漠然と色を考えるよりも、モノをイメージするとやりやすいです。ここでは「カラーテーマ:チョコバナナ」でいきます

2. coolorsで元になる1色をこれは手動で入力します。ここではバナナ色を入力、ロックします
3. チョコバナナのもう片方のイメージカラーであるチョコレート色が出るまで、スペースキーをバンバン押します

4. チョコレートっぽい色きた！ すかさずロックします
5. テーマカラー2色が決まったので、残りの色はお好みで。Webデザイン用であれば、基本的にキーカラーの目立つ色を1～2色に背景用の淡い色1～2色、文字用の濃い色1～2色、くらい選ぶと使いやすいですね。更に加えると、文字用のカラーは本文用に黒かグレーに近い地味色と、リンク用のちょっと派手めな色を選ぶと読みやすいブログになります

6. 決まったら出力。coolorsはPDF出力ができるので便利です。画像じゃないので、16進の数字をグラフィックソフトのカラーパレットにコピペできるのがラクです。

自作カラーパレットでBloggerをカスタマイズ

せっかくなのでBloggerでサンプル作ってみますね。
まずデフォルト状態がこちら。

印象的な配色ではありますが、ちょっとコンテラスト強すぎて目が痛い気もします。
このテンプレートのままで、先ほど作成したカラーパレットで色を入れ替えたのがこちら。

はい、チョコバナナ配色のブログの完成です。
カラーパレットの一番左のグレーが本文の文字色、バナナカラーがヘッダー、一番上の投稿の背景色がチョコレート色です。


1～2色決めるのは簡単だけど、4色5色でバランス良くまとまっているカラーパレット作るのは、色彩のセンスが高い人でないとなかなか難しいものですよね。だいたい、いろいろ考えているうちにどれが良いのか分からなくなってくるw
カラーパレット作成ツールはそんな一般人の強い味方です。