ホームぺージ制作の序盤でまず課題になるのが配色です。
デザインを勉強してきた方なら、なんとなく合う配色が頭にはいっていると思いますが、
考えずに色を使ってしまうと途端に素人っぽいホームぺージや見にくいホームぺージになります。
配色はある程度合うパターンが確立されていますので、ツールで配色を決める事も可能です。
ここでは、他の色をどうすれば良いかを迷った際の便利なツールを紹介します。
Adobe Color
ベースとなる色を決めると、その類似色や補色など合う色を自動で選択してくれます。
iPhoneやiPadで撮影した写真をもとに配色カラーパレットを作成したり、PhotoshopやIllustratorなどと連携もできます。
Happy Hues
配色カラーパレットを選んでも、具体的な使い方が分からないというひとにオススメしたいツール。
カラーパレットを選択するたびに、サイト全体の配色も変更し、ひと目で確認できます。
Scheme Color
大量のカラースキームを公開しているウェブサイトで、その数は軽く1万種類以上。
配色の編集やダウンロードもでき、細かいソート機能が多すぎる配色パターンからお好みの組み合わせを見つけやすくしてくれます。
Color Kitty
画像をアップロードすると自動で色を抽出し、カラーパレットを作成してくれます。
選択された配色は、画像上をドラッグしながら移動することで、手動で色を選択できます。
Color Supply
補色や類似色、3色配色などウェブやグラフィックに活用できる効果的な配色を作成できるツールです。
グラデーションやアイコンイラストなどで色の確認ができる点もポイント。
ColorMind
ボタンをクリックするだけで、人工知能を利用して配色カラーパレットを自動生成できるツールです。
写真や映画、人気のアート作品をモチーフにした配色カラーパレット。
Material UI Colors
Googleデザインガイド「マテリアル・デザイン」の配色をまとめて確認できるオンラインカラーパレットです。
主要カラーとアクセントカラーが一度に表示されるので、デザイン制作もスムーズです。
Material Mixer
上記と同じくGoogleのマテリアルデザイン配色をベースに、UIデザインなどで使いやすい類似色の提案を自動で行ってくれるツール。
色コードがすぐにわかり、よりホームぺージ制作向けとなっています。
この記事へのコメントはありません。