Advertisement

color-tool2015-top1-1

 

PhotoshopVIP編集部: 2015年1月9日に公開された記事を再編集、追記しています。

 

配色はあらゆるデザインの基本となる、とても重要な要素のひとつで、配色を選ぶときは細心の注意が必要となります。色彩理論に基づいたアプローチをすることで、人間の行動を変えてしまうこともできます。

 

 

苦手な人も多い配色えらびをより手軽に行うことができる、無料カラーツールをまとめて今回はご紹介します。直感選ぶだけで配色を決めることができ、デザイン制作で覚えておきたいツールが揃っています。

 

 

 

詳細は以下から。

 

 

 

配色デザインに迷わない!すごい無料カラーツール19個まとめ

 

Palettable

何百万人のデザイナーの配色知識を詰めこんだツールで、組み合わせも考えられた色を、好きか嫌いを選ぶだけで直感的に探し出します。

palettable

 

 

 

Hello Color

スペースキーをクリックして、2色の組み合わせを決めるだけで、一緒に活用できる類似色や補色を表示してくれるお手軽配色ツール。

hellocolor1 hellocolor2

 

 

 

Material UI Colors

Googleデザインガイド「マテリアル・デザイン」の配色をまとめて確認できるオンラインカラーパレット。主要カラーとアクセントカラーが一度に表示されるので、デザイン制作もスムーズです。

Material UI Colors

 

 

 

Brand Colors

海外の大企業やスタートアップで使用されている、ブランディングカラーをアルファベット順にまとめたサイト。気に入ったカラーリングはASE、SCSS、LESS、CSSスタイルでダウンロードすることができます。

brand-color

 

 

 

Coolors

キーボードのスペースキーを押すたびに、スタリッシュな5色のカラーパレットを自動作成してくれるお手軽ツール。生成された配色は、個別で調整することも可能です。

Coolors

 

 

 

Paletton

デザインの目的に合った配色を行うための設計を手助けするカラースキームを、悩まずにマウス操作のみで決めることができます。実際にツールを利用した、具体的で手軽な配色の選び方も参考にどうぞ。

Paletton

 

 

 

Color Lisa

世界の偉大な画家が描いた作品をモチーフに、配色カラーパレットをまとめたサイト。ピカソやダビンチ、エッシャー、モネなど日本でもよく知られているアーティストの作品も多数収録されています。

color-lisa

 

 

 

LOL Colors

現役デザイナーがウェブサイト制作の参考に集めている、美しい配色カラーパレットギャラリー。クリックでHEX値をコピーすることができ便利。

lolcolors

 

 

 

Colorhunt

ユーザーが自由に配色カラーパレットを投稿できるサイトで、人気順やランダムに美しい配色を選ぶことができます。

colorhunt

 

 

 

Colorion

2000種類以上の配色カラーパレットを集めたモンスターサイトで、ワンクリックで色をコピーをできたり、人気順に並べたりと作業が快適になる機能ばかりです。

colorion

 

 

 

Adobe Color CC

iPhoneやiPadで撮影した写真をもとに配色カラーパレットを作成したり、他のAdobeサービスと同期して利用できるアプリツール。

Adobe-Color-CC

 

 

 

Coleure

水平方向に並べられたカラーパレットを選択すると、白&黒抜きテキストと白黒テキストを合わせて確認でき、異なるカラーパレットと色比較することも可能です。

Coleure

 

 

 

ColorHexa

お好みの色を入力すると細かい色の説明や情報に加え、RBGやCMYK、HSL、HSV などさまざまな値に変換してくれます。

Color-Hex

 

 

 

Hues

世界的な大企業やスタートアップのブランドロゴカラーを集めた配色パレット。暖色系や自然系などカテゴリー毎に表示できる点もポイントです。

Hues-Les-Teintes

 

 

 

Bada55

アルファベットと数字を使って表示されるユニークな英単語(英: leet)の配色カラーパレットを集めているサイト。ちなみにサイト名Bada55は、「Badass(たちの悪い、かっこいい)」を意味しています。

BADA55-io

 

 

 

Pictaculous

イメージ写真をアップロードすると使われている色の配色マルチカラーパレットを瞬時で作成してくれます。

Pictaculous

 

 

 

Color Palette Generator

イメージ写真をアップロードするとそれに合った配色マルチカラーパレットを作成、提案してくれます。クライアントやブランドイメージが決まっているときに便利なアイテム。

Color-Palette-Generator

 

 

 

Palette for Google Chrome

インストールしておくことでページに表示しているイメージ写真の配色カラーパレットを作成してくれる、Google Chrome拡張機能ツール。

Palette-for-Google-Chrome

 

 

 

Nippon Color

日本独自に伝わる伝統の色をデザイン制作に活用したいときは、こちらのサイトがオススメ。見やすいカラーチャートに、美しいアニメーションが素敵なツール。

japan-color

 
f

 

 

配色アイデアに困ったら使いたい、無料オンラインツールまとめ

2014年紹介したエントリーで、フラットデザインのカラーリングに困ったときに役立つツールなどが揃っています。

bestcolor_top

 

 

参照元リンク : Best Color Tools and Articles for Designers – CSSAuthor