自動で配色を作れるジェネレーター「Coolors」の使い方

こんにちは!

今回は色を考えるときに便利なジェネレーター「Coolors」の使い方を紹介します。
とても簡単で直感的に美しい配色が作れるので、デザイナーではない人でも美しい色を作るのに役立ちます。
「Coolors」を使えばバランスのとれた色の組み合わせを自動で作成することができます!

目次

  • カラーパレットを自動生成する
  • カラーパレットを自由に編集する
  • お気に入りの配色を保存する
  • みんなが作ったカラーパレットを見てみよう

カラーパレットを自動生成する

さっそくカラーパレットを作っていきましょう!

Coolorsのサイトへアクセスします。
Coolors – The super fast color schemes generator!  https://coolors.co/

START THE GENERATORをクリック。
Coolors

すると、すでに自動生成されたカラーパレットが表示されます。

「スペースキー」を押すと別のカラーパレットが表示されます。気に入った配色がでるまで【スペースキーを押す】だけで自動で配色が作成されます。
スペースキーひとつで無数のカラーパレットを見ることができます。簡単、楽しい!

カラーパレットを自由に編集する

更に、自動生成されたカラーパレットを編集することもできます。

色を固定してパレットを生成する

いくつか決まった色があれば、その色を固定してカラーパレットの自動生成が可能です。

固定したい色にマウスオーバーすると、鍵のマークがでるのでクリックしてロックします。

色がロックされた状態でスペースキーを押してカラーパレットの自動生成を行います。
すると、固定した色に合わせたカラーパレットが生成されます。
この機能を使えば気に入ったものから固定して残しておけます。

お気に入りの配色を保存する

気に入ったカラーパレットが見つかったら、保存しましょう!

保存にはアカウントの登録が必要です。メールアドレスひとつで簡単に登録できます。

カラーパレットを保存する

ユーザー登録が完了したので、カラーパレットを保存していきましょう!

右上のメニューバーから、「SAVE」をクリック。

それぞれ

・カラーパレットの名前
・タグ

を入力して「OK」で保存します。
タグを入力しておくと、後で保存したカラーパレットを探したいときに便利です。

保存したカラーパレットは、メニューバーをクリックすると確認できます。
①のマークをクリックするとタグの一覧が表示され、タグを選択することでタグ別にカラーパレットを確認できます。

保存した配色が多くなってきても用途に応じて呼び出せるので使いやすいです。

カラーパレットを共有する

作成したカラーパレットのページのURLをコピーして送れば、そのURLで相手もカラーパレットをみることができます。
または、メニューバーの「EXPORT」からURLやpngなど様々な形式でダウンロードすることもできます。

私が今回作成したカラーパレットはコチラ https://coolors.co/f4859f-ffdd8f-d3c8ab-49e1b9-70b8d1

みんなが作ったカラーパレットを見てみよう

メニューバーの「BROWSER」をクリックすると、他のCoolorsユーザーが作成したカラーパレットをみたり、保存したりすることができます。

まとめ

簡単にキーひとつでたくさんの配色をみることができてとても便利で楽しいサイトです。
気に入ったカラーパレットはどんどん保存してストックできるところも面白いです。
UIや機能も日々進化しているのでどんどん使い勝手がよくなっています。

色に興味のある人、配色を探したいときに是非使ってみてください!

 

  • シェア
  • twitter
The following two tabs change content below.
波塚浩平

波塚浩平

デザイナー&コーダー株式会社インファクト
デザイナーの波塚です。昔からものづくりが好きで、なんでも自分でつくりたくなってしまうことが多いです。好きな言葉は「若いときに流さなかった汗は、老いてから涙となって返ってくる」です。後で後悔しないよう、今を全力で突き進みます!
  • twitter
  • このエントリーをはてなブックマークに追加
  • Pocket
PAGE TOP
LINE it!