1. Webデザインの配色を考えるときに便利な3つのツール

Webデザインの配色を考えるときに便利な3つのツール

by Kusakabe
 Webデザインの華とも言える配色ですが、サイトのメインカラーを決めてサブカラーを決めて…とひとつひとつの色を調べて調整するのは時間がかかるものです。色単体では気に入っていたのに、並べた途端にイメージが違ってしまったり、背景色と文字色のバランスがどうも今ひとつだったりすることもあるでしょう。そんな悩みを解決する、配色の時間を短縮しつつ楽しくカラーバランスを選べる、便利なツールを紹介します。




1. ウェブ配色ツール Ver.2.0

 基本色を一色決めるだけで、見出しカラーやサイドカラムのメニュー背景色まで、RBGカラーコードで出してくれるWebツールです。見た目を確認しつつ、サイト全体のカラーバランスを自動的に決めてくれるので、とりあえずのカラーリングを決めたいときやメインカラーは決まったけれど他の色に困っているときなどに重宝します。暗め明るめ・背景色ありなしなどのオプションも設定できます。

2. 原色大辞典

 
原色の名前やカラーコードだけではなく、和名の色選択も可能です。また「配色」タブで背景色と文字色のバランスを見れます。更に任意の色でストライプを作ってくれるので、色が細かく混在するようなパターンのイメージをつかみやすなります。また任意の言葉から配色を合成分析してくれる機能があります。クライアントの「ふわっとしたかんじ」「カチっとしたイメージ」など、よくある難解な指示を、明確にカラーチャートで分析してくれます。



3. 0to255


 色を1つ選ぶと、その色の明度を変えてタイル上に並べてくれるツールです。アイコンやボタン作成のときにグラデーション効果をつけたい場合、リンクテキストのホバー色を変えたい場合など、同系色だけれど区別のつきやすい色を複数ほしい時に、とても便利です。




 ここでは、Webデザインの配色を決めるときに役立つツールを紹介しました。便利なツールを効率よく用いて色選びや配色に悩む時間を減らし、カラーコーディネイトを楽しみながらWebデザインをしていきましょう!


U-NOTEをフォローしておすすめ記事を購読しよう
この記事を報告する