Webデザイン、イラスト制作、CGデザイナー、インテリアデザイナー、…等
デザインにとって悩みなのは色の配色ですよね。
- 「ピンとくる配色が見つからない..」
- 「配色のバランスはどうしよう..」
- 「配色の知識が無いから分からない..」
こんな感じで困っている方が沢山いると思います。
そんな時に素早く解決してくれる便利な無料カラーパレットツールを5つ紹介していきます。
01: Adobe Color CC

Adobe公式が運営しているサイト。
———–【このサイトの使い方】———–
- 円形のカラーホイールを操作して色を抽出し、自分だけのカラーを作りだせるツール。
Creative Cloud アプリケーションと連動することが出来るのでPhotoshopやIllustratorなどで同期して利用できます。 - 作成で「テーマを抽出」からファイルをドラッグ&ドロップすれば自分が持っている好きな画像からカラーを抽出して、カラーパレットを作り出すことが出来ます。
- トレンドは、BehanceとAdobe Stockのクリエイター達のカラートレンドを保存したりできます。ゲームデザイン、ファッション、イラスト、UI/UX、建築…といった多様な業界による最新のカラーを閲覧できるのも最大の魅力だと思います。
- 探索フォームも充実していて日本語にも対応しており、様々な要素を探し出すことが可能です。
※トレンドカラーのダウンロードやライブラリに追加するにはAdobeアカウントが必要です。
02: IN COLOR BALANCE
URL:https://color.romanuke.com

見慣れない言語のサイトですが、簡単操作でわかりやすい。
———–【このサイトの使い方】———–
- ランダムに表示される画像から好きなものを選ぶと、その画像の詳細なページが開きます。各カラーごとに#から始まるカラーコードが表示されます。
- 選択された画像の下に関連した色の画像が表示されるようになります。
- 右上の小さい四角いカラーアイコンから好みの色を選択すれば、その色のテーマに合った画像が表示されます。
03: Color Hunt

シンプルUIで分かりやすいサイト。
———–【このサイトの使い方】———–
- 左メニューから自分の好きな色を選択して検索することができます。
- 「New」は最新のカラーを表示さます。
- 「Popular」はこのサイトの一番人気カラーを表示させることができ、月/年/全期間 ごとに分けて検索できます。
- 「Random」は全てのカラーをランダムに表示さます。
- 「Collection」は各カラーごとにハートアイコンが付いていて、クリックするとコレクションに追加されます。再度押すと削除されます。
04: Color Palette Generator

UIのデモを使って配色のバランスを見れるサイト。
———–【このサイトの使い方】———–
- トップページにある検索フォームから、カラーコード又は名前を入力して色を探すと6つのカラープリセットが表示され自分に合ったカラーを選択できます。
- 選択されたカラーパレットは一つ一つ変更を加えたり、入れ替えたりできます。
- カラーパレットの下にある「Live UI Kit Demo」でカラーパレットで指定した色がリアルタイムでUIデモに反映され見栄えを確認できます。2種類のUIデモが用意されています。
- 下の方に関連したカラーが表示されるようになります。
05: Scheme Color
URL:https://www.schemecolor.com

シンプルで見やすく、とても分かりやすいサイト。
———–【このサイトの使い方】———–
- トップページにある検索フォームから、色を検索することができます。
- スライドメニューから季節や行事に関する、結婚式、秋、レトロ、レインボー、といった単語からランダムにカラーを表示させることができます。
- 気に入ったカラーを選択すると色ごとに、詳細なカラーコードやステータスが表示されます。
- 各カラーの入れ替えや色の変更をすることができます。
まとめ
いかがだったでしょうか?
配色の世界は広く難しい世界だと思います。ですがこのようなオンラインサイトを利用したり、配色の書籍等を買って基本やセンスを学んでいけばデザインの幅も広がっていくと思います。
他にも無料で使えるサービスサイト等、見つけ次第たくさん発信していきたいと考えています。
ぜひ本記事で紹介したサイトを利用してデザインのお役に立てていただければなと思います。



