配色に悩んだときの参考サイト7選！

まずは王道のAdobe Color！Adobe Colorは機能がとても豊富に揃っています。

下記の機能を用途に合わせて使いこなせるようになるととても便利です。

①カラーホイール

カラーハーモニーを選択し、ホイールを動かすだけで簡単に5色のカラーパレットが作成できます。

②トレンド

ヘッダー中央にある「トレンド」をクリックするとファッション・グラフィックデザイン・イラスト・UIUX等、様々なジャンルにおける最新のカラートレンドを探すことができ、写真・画像と共に使用されているカラーパレットもサムネイルで表示されます。

③写真・画像から

写真や画像からカラーを自動で抽出したり、グラデーションを作成することも可能です。

④探索

ヘッダー中央にある「探索」をクリックすると膨大な量のカラーパレットが表示されます。

⑤アクセシビリティツール

どのような方でも利用できるように、色覚多様性に対応したカラーパレットを作成できたり、コントラストチェッカーで文字のコントラスト比や判定結果を自動で表示してくれます。

Adobe Color

補色や類似色、トライアド等、2色、3色、4色の組み合わせから配色を探せるツールです。

選んだ配色がアイコン、パターン、グラデーションに自動で反映され、確認できるのも便利なポイント！

COLOR SUPPLY

キーボードのスペースキーを押すたびに、ランダムで5色のカラーパレットを生成してくれるサービスです。

気に入った色が見つかればその色を「ロック」することができ、その色に合う4色がランダムで生成されていきます。

また、トレンドのカラーパレットを一覧で見ることも可能です。

自分好みの配色を見つけてみましょう！

​​Coolors

4色のカラーパレットを集めたシンプルなサイトです。

ソートやフィルタリング、背景色変更等機能が充実しています。

4色のカラーパレットをクリックすると、カラーコードとrgba値が表示され、そのテキストをクリックするだけで簡単にコピーができます。

また、カラーパレットだけでなく、フラットカラーや、画像からカラーを抽出することもできます。

ColorDrop

Pigment（顔料）とLightning（光）の2つの量を調整して自分好みの配色を見つけられるサービスです。

配色パターン数は非常に多く、パターンをクリックすると、トーンを調節することができます。

検索機能では写真を基に配色を探すこともできます。

Pigment

日本の伝統的な色を探せるサイトです。

和テイストのデザインを作成するときにおすすめ！

色の名前をクリックすると背景がその色に切り替わります。

色の切り替わりの際のアニメーションも美しく、色の名前を見ているだけでも楽しいサイトです。

NIPPON COLORS

美しいグラデーションの配色パターンが揃ったサービスです。

優しいグラデーションから補色を使ったメリハリのあるグラデーションまで様々なグラデーションを探すことができます。

cssコードのコピー、2500x2500pxのPNGファイルでグラデーション画像のダウンロードができます。

また、PhotoshopとSketch用にすべてのグラデーションをダウンロードすることもできます

WebGradients