デザインしようとした時、なんとなくメインのカラーは決まっているがどういう配色をしたらよいのかがよく分からない…配色のアイディアや見本があればいいのになと思う事ってありませんか？
今はググると結構たくさんの配色サイトがあります。
どのサイトを利用しようか…とあちこち渡り歩くのも大変ですよね。ある程度どういう内容の配色を提案してくれるのかが分かれば利用する配色サイトも決めやすいと思います。
この記事ではわたしが実際に利用しているオンライン配色ツールの中から、このサイトはこんな特徴があって使い勝手はこうだよ！というのをサクっと解説していきます。
きっと配色サイトで悩む時間短縮の手助けになりますよ！
【便利な無料オンライン配色ツール13選】フライヤー、サムネ、ヘッダー、アイコンのデザインで使える配色アイディア
人は色から色んなイメージを得ています。デザインをする時、形や質感も勿論ですが色の占める割合はかなり多くなります。
デザインするときに最も悩んでしまうのが配色ですよね。なぜならイメージに大きく影響してしまうから。自分の中のイメージにも偏りがあるので客観的に色んな配色を知っておくのがベストです。
色は感覚的なところもありますので、パッと見てコレ！と思うものと色の持つ多くの人が感じるイメージを理解してデザインに取り入れるのが大事です。
そんな配色の悩みを解消してくれる、プロもよく使う便利なオンラインの配色ツールサービスをご紹介していきます。
PALETTELIST
任意の２色を選択するとそこから自動で配色アイディアを生成してくれます。操作性も良くてどんな配色がでてくるのか！と色を選択するのも楽しくなるツールです。
色味に合わせた配色にターゲット絞って使えるので、だいたいこんな色で作りたい！という時にはとても便利です。
COLORION
６万以上の配色チップが要されているサイトです。
配色の量が膨大すぎるのである程度この色味でと決めてから検索をかけないと少し大変かな…と。探すのは大変ですが配色のストックが多いので、何度か利用していると気に入った斬新な配色に出会えるのが良いです。
気に入った色味を決めて検索することができます。
ColorKitty
このサイトの一番の魅力は、デザインに使う画像をもとに色を抽出してくれるところです。ここで抽出された色を使う事でデザイン全体に統一感がでるので配色に悩まずに済みます。
ピンポイントで自動で色を抽出してくれるので画像中の色をいちいちピックアップして数値を抽出する手間も省けます。デザインに使う画像をドロップしてサイトにアップロードするだけなので使い方も超簡単。
Pigment
Pigment（顔料）とLighting（光量）で配色カラーパターンを探せます。印刷物にするCMYKで作る場合とデバイス内で表示する画像RGBで作る場合の両方で使えるツールです。
こちらのツールもColorKittyと同じく写真をベースに配色を探すこともできます。
なんといってもサイトのデザインがかわいい。見ていて楽しくデザインのモチベーションもあがります。サイトの操作性もとても良い。
Colormind
画像左下の「Generate」ボタンをクリックすると次々と配色パターンを作成してくれるツール。特に基本的な色を決めていない時に新たな配色を考える時に便利です。
もともと用意されている色ではないので、ぼーっとクリックし続けているとふとコレかな…という配色に出会えるというのが一期一会な感じでインスピレーション刺激されるのが良いです。
AIが画像からカラースタイルを学習してジェネレートしてくれるのが特徴です。
SCHEM COLOR
デザインに使用するテーマカラーを選択すると３～６色の配色チップが自動的に選択されて何種類か一覧表示されます。
テーマの色以外に特に配色のイメージが決まっていない時にいくつかのアイディアを見比べられるのがこのツールの良い所です。
このテーマカラーに子の配色！？という新しい配色のアイディアを発見できるのが楽しいツールです。
Khroma
任意の50色を選び自動で配色を作ってくれます。そのカラーをベースにした時に文字をこの色にするとこんなコントラストになるというのが一覧で見ることが出来ます。
最初に指定した50色の傾向から、その後は「Generate」をクリックする度に選んだ50色からの傾向で別の配色をサジェストしてくれます。
Colorable
ベースカラーと文字の配色のコントラストをチェックできます。選択したカラーの配色でテキストと背景が見やすいかどうかを判断します。文字の見やすさはデザインでは必須なのでかなり役に立つツールです。
Failがでたらは見にくいとされてる配色なので、そういう配色の勉強も合わせてできるのが良い所です。
PALETTABLE
任意で感覚的に選んだ色から配色を作ってくれるツール。
カラー数値の下にあるレバーのマーク（マウスオンするとAdjustと表示されます）でカラーを選択し、下の「Like」「Dislike」ボタンで好きか嫌いを感覚的に選択して配色を生成していきます。
自分の傾向に偏りがちではありますが、その時の体調や気分によって斬新な配色が生まれることがあるのが闇鍋感があって楽しくてこのツールの良い所です。
出来た配色チップはダウンロードまたはリンクでゲットすることができます。
ColorDrop
アイシャドウのような４色パレットから配色を探せるツール。見た目にキュートなところも創作意欲を刺激してくれます。
４色の提案なので配色やデザインの難易度が少し下がります。あまり色を多く使いたくないなという時や沢山の色を使ってのデザインが苦手な人にちょうど良いもおすすめ。
画像から色を抽出することもでき、カラーコードのチェックも出来ます。
画面がライトモードとダークモードに設定できるので背景が明るいデザインと暗いものとで比較して選ぶことが出来るのも良い所です。
NIPPON COLORS
その名のとおり日本の伝統色の名称とCMYKの数値がわかります。和のデザイン時に役に立ちます。このツールで提案してくれる色を使うだけでかなり和っぽいデザインに仕上がります。
和の色名の勉強にもなるし各名称をクリックすると画面がその色に変化するので見ているだけでも楽しいツールです。
Color Hunt
投稿型の配色サンプルサイトです。特に斬新なアイディアに頻繁に出会える…というわけでもないのですが日々更新されているのでふと覗きに行くと新しい配色に出会えたりするので、時々チェックしています。
自分の配色を是非みんなに広めたい！という欲のある人には楽しいツールだと思います。
Picular
色ではなく「キーワード」から配色を提案してくれるツール。キーワードを入力するとそのイメージに合った配色が表示されます。
斬新さはないのですが、デザイン初心者にはこのキーワードにはこういう配色という基本的なカラーのイメージを持ちやすくなるのでおすすめのツールです。
まとめ
便利なオンライン配色ツール１３選をご紹介しました。
ツールの簡単な説明からここなら使えそうかな…と思われるものをまず選んで使ってみて、使い勝手をご自身で体感してみて下さい。
配色はどうしても自分の中のイメージに偏りがちなので、こういったオンラインツールで常に感覚をアップデートしたりブラッシュアップしておくとイメージづくりにも役に立つので是非ご活用くださいね！
