Webデザインの配色をする時に参考になる６つのサイトを紹介

WEBサイトでもブログでもデザインをしていると配色に困ります。実際にしっかりとした配色をするのは、感覚だけでは無理があるものです。一つの配色がおかしいだけで、デザインの善し悪しが決まってしまう事もあります。
少ない色数であれば、なんとかまとめる事も出来ても、多くの色を使う場合は収集がつかなくなり、ごちゃごちゃしてしまう。全体の色のバランス等も考えなければいけない。色を扱うというのは、とても難しい事です。
私自身もデザインをする時に、色については、困ったり悩んだりする事は多々ありまして。そんな時に、今回紹介するサイトを参考にしながら、色を決めたりしていました。

基本的には何年も前から利用していたサイトなので、現在は他にも良いサイトがあるかも知れませんが、今でも愛用している色関係のサイトを紹介します。

Adobe Color CC

color.adobe.com

 

元Kulerですね。今ではColorCCと言う名前。
こちらは配色がメインのサイトです。Adobeが作っているだけに、非常に使いやすく、分かりやすい。そして作りこむ事の出来る設定の細かさ。Adobeアカウントがあれば保存も出来る。フォトショやイラレへの適用も出来るのでよく使います。また他の人が作った配色を利用する事も可能。アカウントがなくても十分に使えます。

 

paletton

paletton.com

 

結構前からある配色サイト。長く使っているのですが、現在のメインはColorCC。出来る事は非常に似ているのですが、ここの特徴は実際のWEBサイトの形で配色例を見せてくれる所です。色の割合や、どこに使うか等も分かるので、どんな色でサイトやブログをつくろうかと思って居る人にはとても参考になるサイトだと思います。

 

原色大辞典 

www.colordic.org

 

原色大辞典と言う事ですが、原色だけでなく、和色、パステルカラーや謎の東京メトロのカラー等を見る事が出来ます。色のランキグが見れたりと、楽しめたりもします。山吹色が一位なのは不思議ですが(笑)まずは色を知る所も大事ですからね。ここも外せないサイトです。

 

CSS３ GENERATOR

www.css3.me

 

スライダーをいじるだけでCSSグラデーションが簡単に出来てしまう。他にも角丸やシャドウ。透明度も調整が出来る。オールドIEにも対応したコードを吐き出してくれる。UIが分かりやすいだけでなく、UXをも満たす優良ツール。

 

CSS Gradient Generator

www.colorzilla.com

 

こちらもグラデーション作成が出来るのですが、このサイトは結構前からあって、ずっと使っているような気がします。自分でグラデーションを作る事も当然出来るのですが、プリセットも用意されているので、気軽に使用出来ます。上のCSS GENERATORよりも細かい設定が可能。グラデーションのかけ方の参考にもいいかもですね。

 

Colourlovers

www.colourlovers.com

このサイトで見れるのは、配色のサンプルになります。投稿サイトとなっていて、多くの人が投稿をした配色サンプルを見る事が出来る。メニューのTrendsからWebsiteを選ぶと、有名なサイトの配色も見れたりするので勉強になります。配色に迷ったりしたらおすすめなサイトです。

以上が、色に困った時に参考にしているWEBサイトです。他にも何かありましたら、足して行こうと思っています。また、おすすめのサイトがあれば是非教えてもらえると嬉しいです。

最後迄お読みいただきありがとうございます。感謝