今回は、配色に悩んだ時のアイデア出しに役に立つ、カラーパレットツール・Webサービスを厳選して紹介します。様々なカラーパレットがありますので、自分に合ったツールがあったら活用してみてください。
- Adobe Color
- HUE/360
- Coolors.co
- BrandColors
- Color Hunt
- colourcode
- Palettable
- 0to255
- Material Palette
- Material Design Colors
- LOL Colors
- Color Lisa
- Random Material Palette Generator
- Leonardo
- Pigment by ShapeFactory
- colors.lol
- ColorDrop
- Happy Hues
- Image Hues
- Palette List
- ColorSpace
- Color Palette Generator
- NIPPON COLORS
- 配色の見本帳
おすすめのカラーパレット
Adobe Color
Adobeが提供しているカラーツール。Creative Cloudユーザーであれば無料で利用することができます。自分での配色パターン作成、画像から配色を抽出のほか、探索ではCreative Cloudユーザーの人気順で配色が一覧できます。気に入った配色があれば、ASE（Adobe Swatch Exchange）ファイルのダウンロードすることができます。また、PhotoshopなどAdobe製品内でカラーパレットを同期することも可能です。
HUE/360
brightness(明度)を選択し、メインの色を決定すると、それに合う色が表示されます。色の組み合わせが決まったらカラーコードのコピーして使えるシンプルなカラーパレットです。
Coolors.co
ユーザーが作成したカラーパレットを共有することがでるWebサービス。iOSアプリやChrome機能拡張、Photoshop・Illustratorのプラグイン(有料)などもある多機能なサービスです。
BrandColors
企業・サービスのブランドカラーをコレクションしたサイト。Microsoft・Googleをはじめ、数多くのブランドカラーを閲覧できるので企業・サービスの配色を参考にしたい場合はこちらがオススメです。
Color Hunt
4色の配色パターンを提案してくれるカラーパレット。「Trendy」「Popular」「Random」から一覧を閲覧することができ、お気に入りの配色・色の組み合わせを登録することもできます。
colourcode
ブラウザ上でマウスを動かし配色を決定していくスタイルのカラーパレット。カラーコードはHEX・RGB・HSL・HSV・CMY・CMYKで表示され、イメージ(PNG)のほかにsass・less・styl・cssファイルでのダウンロードも可能です。
Palettable
Palettableが提案する色を「好き」か「嫌い」で選択し、配色を決定していくカラーパレット。最大5色まで配色することができ、配色したカラーはPNG形式でダウンロードすることができます。
0to255
選択した色をグラデーション(濃淡)で表示してくれるカラーパレット。同系色の配色を考えてる方に便利なカラーツールです。ボタンのロールオーバー色を濃淡で表現したい場合にも役立ちそうです。
Material Palette
マテリアルデザインカラーから2色選択すると、そのカラーに合う配色パターンを自動的に提案してくれるカラーパレット。気に入った色はCSS・SASS・LESS・SVG・XML・PNGにてダウンロードすることができます。
Material Design Colors
マテリアルデザインカラーのカラーコードを簡単にコピーできるカラーパレット。マテリアルデザインのほかにHTML・フラット・ソーシャルなどのカラーパレットもあります。
Color Lisa
世界の名画の配色からカラーパレットを作成しコレクションしたサイト。カラーパレットの元となっている絵画へのリンクも貼られており、色の組み合わせを勉強する際に役立つサイトです。
Random Material Palette Generator
ランダムにマテリアルデザインのカラーパレットを提案してくれるジェネレーター。テキスト・カード・ロゴといったケースを確認しながら色の組み合わせがランダムに表示されます。PDF・PNG・HTMLにてダウンロードすることができます。
Leonardo
ターゲット色のコントラスト比をベースにカラーパレット生成してくれるジェネレーター。テキスト・ボタンがExampleで表示されるのでイメージが掴みやすい。Webサイト・アプリデザインとする時に使用してみたいカラーパレットです。
Pigment by ShapeFactory
2色の配色集めたカラーパレット。右上の虫眼鏡をクリックすると、フォトストックサイトUnsplashのイメージから抽出したカラーが表示されます。Unsplashの2色を使用したデュオトーンイメージも確認できます。ASE（Adobe Swatch Exchange）ファイルもダウンロードすることができます。
ColorDrop
4色のカラーパレットをストックしたサイト。New・Popular・Randomから配色をソートし好みのカラーを検索することができます。イメージスキャンからアップロードした画像からカラーを抽出することも可能です。
Happy Hues
左のカラーパレットから配色を選択すると、右エリアのデザインが選択した配色で表示されます。配色だけではイメージできない場合でも、Webサイト全体で配色が適用されるので配色のイメージが掴みやすい。
Color Palette Generator
スペースキーを押下する度にランダムにカラーパレットが生成されるサービス。Cキーでクリップボードにコピーすることができます。
NIPPON COLORS
日本の伝統色をコレクションしたWebサービス。色名をクリックするとRGB・CMYKが表示されます。和風テイストのデザインを制作する際は参考にしたいサイトです。
