配色が苦手な方へ！おすすめ配色ジェネレーター

DIOブログ

自分で配色するのが苦手という方にはオンラインで無料で利用できる配色ジェネレーターがおすすめです！

今回は厳選した幾つかの配色サイトについてご紹介します。

Adobe Color

上部にあるバーの『作成』をクリックして、左の『カラーハーモニールールを適用』からルールを選択します。その後、カラーホイール内のキーカラーのセレクタを動かすと自動的にサブカラーを生成してくれます。

『捜索』をクリックすると、他の人が制作したカラーパレットを見ることができます。

画像を取り込んで配色を提案してくれたり、ランダム・トレンドの配色が見れるサイトです。

『Start the generator!』をクリックするとカラージェネレーターへリンクし、『Explore trending palettes』をクリックするとトレンドのカラーパレットを見ることができます。

左エリアにあるPigment（顔料）とLightng（光量）を調整したり、カラーパレットアイコンから基調となる色を選んだりすると、配色を提案してくれるサイトです。

右上の検索アイコンを押すと、写真素材を基準に配色を選ぶこともできます。

中央のバーアイコンを押して基本色を設定した後、下部の『Dislike（嫌い）』『Like（好き）』ボタンを押していくだけで、ジェネレーターが提案する色が追加され、カラーバレットが出来上がるサイトです。

ゴミ箱アイコンを押すと、選択した色を取り除くこともできます。

配色を参考にしたいサイトで使用している色を抽出できる便利なブラウザのアドオンです。

色を参考にしたいサイトのページを開き、アドオンアイコンをクリック後、『Webpage Color Analyzer』を選択すると、ページ内のCSSで指定された色が、カラーパレットで抽出できます。

一部の色をピッカーで抽出することも可能です。

色を参考にしたいページを開き、アドオンアイコンをクリックしたら、下に出てくる十字キーに持ち替えます。

そのままページ内の色を抽出したい場所をクリックすると右側にカラーコードが出てきます。

配色サイトを利用して色のバランスなど配色について勉強にもなりますのでこれらのサイトは是非お勧めです！

配色に迷ったら活用してみてください！