others

色の組み合わせに迷わないWeb配色の基本

webサービスを作る時に「どんな色のサイトにしようかな」と迷うことがあると思います。

今回は、ノンデザイナーでも簡単におしゃれなサイトに見える配色について説明します。

配色の基本を知る

Webサービスの色を考える時には、3つの色を決めます!

たった3つだけでいいんです。

たくさん色を使いたくなると思いますが、3つくらいに収めておくのが無難です。

3つとは、「メインカラー」「アクセントカラー」「ベースカラー」の3色です!

メインカラーとは、ヘッダーなど至るところに使われる色です。

アクセントカラーは、例えば「登録」ボタンなどここぞという時に目立たせたい色に使います。

ベースカラーは、背景色とかですね。

より詳細な3色の説明については、下記のサイトが詳しく説明していましたのでリンクを貼ります!

色を選ぶ

配色の基本がわかったところで、実際に色を選んでいきましょう。

色は無数にあるので、あたりをつけたいですね。

色を選んでもらう!

こちらのサイトは、好きな言葉を入れると自動で言葉に見合う色を選んでくれます。

 

自分でメインカラーを選ぶ

自分で決めたいという方

そんなときに役立つサイトがこちらです。

カラーパレットといって簡単にそれっぽい色を見つけられるようになっています。

直感でいいの一つ選びましょう。

 

ここで、選んだ色は「メインカラー」にしましょう!

「ベースカラー」「アクセントカラー」も選びたいところなんですが、かなり目立つ色が多いので反発してしまいます。

 

色は、サイトの見栄えを大きく左右するものになります。

ツールでおしゃれなサイトを目指しましょう!

ABOUT ME
アバター
ロッピー
コンサルタントから2018年にエンジニアに転向。年収400万円のサラリーマンエンジニアから、半年で月収100万円を稼ぐエンジニアになった。 Python、Golangなど単価の高い言語を得意とする。