【厳選】プロが選ぶおすすめWEBカラー配色ツール4選

【厳選】プロが選ぶおすすめWEBカラー配色ツール4選

2021年9月20日

※当サイトはアフィリエイト広告を利用しています。

WEBデザインにかかせないWEBカラーツール。

私が使ってきた中でおすすめのツールをいくつかご紹介します。

カラー選びや配色が苦手、という初心者WEBデザイナーさんにもおすすめです。

1. COLORS

URL:https://coolors.co/palettes/trending

カラーパレットがどれもキレイで見ているだけで楽しいツールです。
カラーの組み合わせが気持ち悪いと萎えるけど、これはどれも素敵で悩みます。

おすすめな点

  • カラー単体をクリックひとつでカラーコードをコピー
  • パレット右下の「…」からURLリンクーやPDFのエクスポートもできる
  • パレット右下の「…」からジェネレーターを開くと各カラーの階層もチェックできる
  • お客様に提案・共有しやすい

2. SCHEM COLOR

URL:https://www.schemecolor.com/

こちらも同様にカラーパレットが豊富。画像イメージからのカラーリストもデザインの参考になります。

おすすめな点

  • カラーパレットを選ぶと別ページで個別のカラーをコピーできる
  • カラーの並び替えや、個別のカラーを変えてカラーの組み合わせを調整できる
  • 拡大パレットの下には関連したカラーパレットが表示される
  • ダウンロード可能(jpgのみ)

3. Color Hunt

URL:https://colorhunt.co/

こちらも見ているだけで楽しいサイト。イマジネーションが膨らみます。

おすすめな点

  • カラーパレットをが豊富
  • 海外らしいカラーの組み合わせで他店と差別化できそう
  • 拡大したページではURLリンクあり
  • ダウンロード可能(jpgのみ)

残念なのは、カラーコードのコピーがワンクリックでできないところかな。

4. 【一番おすすめ】Colorbase

先日つぶやいたツイート

最近は、こちらのColorbaseがお気に入り。操作性もいいし、触り心地が気持ちがいい。

おすすめな点

  • メインのカラーを選ぶと、そこからカラー展開や組み合わせが豊富。
  • 似合う背景色や合うグレーなども悩まなくてすむ
  • 日本製
  • アカウント必要なしで独自のパレットを保存できる
  • 共有URLのコピー
  • CSSとJavaScriptのエクスポートあり
  • ダークモードあり
  • 制作者の方の細やかさが伝わるUI
  • 要望をフィードバックしてくれる(私が欲しい機能は追加されました)

Colorbase さんんは好きすぎて、いっぱいあげてしまいました。

お客様にカラーを選んでいただく際にも使えますね!

カラーの配色におすすめな本

WEB上では、直感的にカラーを選ぶことができますが、そもそもの配色の理論やなど学びを深めたい方には本がおすすめです。

眺めているだけでデザインがしたくてムズムズしてくると思います。

見てわかる、迷わず決まる配色アイデア 3色だけでセンスのいい色

COLOR DESIGN カラー別配色デザインブック

ツール関連の記事

【仕事効率化/テキスト編】WEBデザイナーのためのおすすめ無料ツール
WEB制作って形の決まったものではないので、時間や作業の効率化を模索しますね。 私 (@koba_natsuki) が仕事のときに欠かせないお助けツールをいくつ…
kobanatsu.blog