WEBデザインする際に色の見本になる5つの配色ツール

デザインをする時、テーマになる色やサブカラー、さし色はどうしようかとか悩みますよね。

WEBデザイナー1年目の人なら尚更、自分も美術大学を出てるわけでは無いので配色に関しては凄く悩んでデザインしていました。

 

そこで頼りになるのが配色ツール。色の情報や組み合わせなど配色に困った時に大活躍してくれます。

僕が実際に現場で使っていた配色ツールを紹介します。

<スポンサードリンク>

 

ColorHexa

color01

ColorHexaは指定した色に関する細かな情報や色彩配合の情報やRGB、CMYKから、カラースキームなども生成。

非常に使い勝手の良い配色ツール。

 

 

color3

検索ワードでカラーコードを入力するとコードにマッチした色を予測変換で表示してくれます。

しかも色付きなのでとても見やすい。

 

 

color4

指定した色の彩度や明度を変化させた状態も表示してくれるので指定した色よりちょっと暗めが良いとか細かい部分の微調整がしやすいのが特徴。

 

ColorHexa

 

 

Color Pickers

color5

今流行りの色が様々なバリエーションで用意されているので配色決定がスムーズ実行できます。

フラットデザインを作る時に使っていました。

 

Color Pickers

 

 

HUE/360

color6
ベースとなる色を決めると自動でその色に合う色を絞り込んでくれる。さまざまなパターンが用意されているがどれを選んでもバランスの良い配合になるのでベースとなる色が決まってる場合はよくこのツールを使います。

 

HUE/360

 

 

色色 [:iroiro]

color7
言葉を入力するとそれに関連される色に変換される面白いサービス。

日本語にも対応しているのでサイトのキーワードなどが決まっているなら使う価値はあります。

 

 

color8

ちなみに人物名でも色に変換してくれます。

本田圭佑って色で合わすとこんな感じなのか。

 

色色 [:iroiro]

 

 

ウェブ配色ツール Ver2.0

color9

色を指定しプレビューを見ながら色の配色を選べるジェレネータ。テーマカラーを決めたらそれに合う配色をしてくれるので便利。WEBデザイナーには昔から定番のツールではないでしょうか。

 

ウェブ配色ツール Ver2.0

 

 

配色で悩んでいる人はツールを使い作業の時間効率化を計りましょう。

 

 

スポンサードリンク

WEBデザインのオススメ本・教材

Powered by amaprop.net