creatersnest70

いろんな配色のアイデアをくれるWebサービスまとめ


Webサイトを作成するにあたり、配色は重要になってきます。
配色によって、そのサイトの印象ががらりと変わります。
でも自信がない…そんなあなた方でも大丈夫!
配色のアイデアが詰まったサイトをご紹介させていただきます。

COLOURlovers

p1

http://www.colourlovers.com/

海外サイトになります。
コミュニティサイトで、自分の配色アイデアを登録することもできますし、他のユーザーの配色アイデアを観たり、ダウンロードしたりすることもできます。
会員登録する必要もありません。

 

NIPPON COLORS

p2

http://nipponcolors.com/

日本の伝統色が一目で分かる配色サイトです。
和の色は言葉で表しても実際の色のイメージが付きにくいものです。
こちらのサイトはカラーコードまで分かるので、和の色を調べるのにもってこいのサイトです。
またそのカラーを背景に他の色との配色も見れるのでとても便利です。

 

Color of Book

p3

http://colorchart.jp/

書籍に使用している配色を調べてくれるサイトです。
タイトルやジャンルから調べることが可能です。
かなり細かく調べてくれるので、とても便利です。
Web以外にも活用できそうなサイトですね。

 

Adobe color CC

p4

https://color.adobe.com/ja/create/color-wheel/

Adobeが提供しているカラーパレットです。
アプリもあり、カラーテーマや、iPhoneなどから写真の色の配色を保存したりすることもできます。
また同期させて共有させることも可能です。

 

ColRD

p5

http://colrd.com/

海外サイトになります。
単色ギャラリー、複数カラーパレット、グラデーション、画像を元にした配色パターンとカテゴリー分けされています。
また、自分で作成することもできます。

 

ColoRotate

p6

http://mobile.colorotate.org/

海外サイトになります。
3Dのカラーパレットです。
自分の配色アイデアを登録することもできますし、他のユーザーの配色アイデアを観たりすることも可能です。

 

Coolors

http://app.coolors.co/

海外サイトになります。
URLにリンクすると、自動的にこのように表示されます。
スペースキーを押すと、また違った組み合わせを表示してくれます。
カラーパレットをエクスポートすることも可能です。

 

 ColorBlender

p8

http://www.colorblender.com/

海外サイトになります。
基準となる色を決めると、自動的にそれに合う色を選別してくれます。
カラーはパレットしてダウンロードすることもできますし、サイト内に保存し共有することも可能です。

 

Pictaculous

p9

http://pictaculous.com/

海外サイトになります。
写真や画像からカラーパレットを生成してくれます。
生成されたカラーパレットはダウンロードしたり、メールで送ったり、共有させたりすることが可能です。

 

Check My Colours

p10

http://www.checkmycolours.com/

海外サイトになります。
WebサイトのURLを入力してCheckボタンンを押すと、サイト内で使われているカラー情報を教えてくれるサイトです。
また、カラーコントラストのテストも行ってくれます。

 

まとめ

今回は、いろんな配色のアイデアをくれるWebサービスをまとめてみましたが、いかがでしたでしょうか?
ただの色見本だけではなく、配色パレットや写真やサイトからカラーを生成してくれるサイトはデザインをするにあたり、とても便利ではないかと思います。
ぜひ、参考にして頂けると嬉しいです。

本サイトが運営するWebデザインのオンラインスクールが公開中!
以下のリンクからお申込みで、特別料金の70%OFF!

未経験からプロのWebデザイナーになる! 400レッスン以上の完全マスターコース
こちらのコースは全くの未経験の方が、プロのWebデザイナーとして働けるレベルになることを目的としたコースです。
・全422レッスン & 42時間! 通学スクール80万円相当の内容
・授業×チャレンジ課題で実践的なスキルが身につく!
・過去1100名以上のスクール卒業生を輩出した、 Webサービス運営企業・デザイナー輩出企業だからこそ作れるプログラム

Webやアプリの最新デザインツール Sketch3 |100レッスンの完全マスターコース
Sketch3未経験からプロレベルを目指す、充実したコースです。
Sketch3の単なる機能説明をするような、つまらないコースではなく、アイコン制作、ボタン作成、メインビジュアル制作、Webページの制作など、実際の制作をしながら実践力を身につけます。
1000名以上の卒業生がいる実績ある日本のWebデザインスクールが提供しています。


NESTonlineBlog編集部

NESTonlineBlog編集部です。ご寄稿頂いた記事などを公開していきます。

Next Article美しいfaviconを作成するために覚えておきたい10のコツ