ベースカラーとは
読み：べーすからー英語：Base color
更新日：2026年10月31日
ひとことで
ベースカラーとは、配色の中でいちばん広い面積を占め、全体の印象の土台になる色のことです。
ひとに説明するなら
「ベースカラーは、配色の土台。Web なら背景、部屋なら壁や床の色。主役の色（メインカラー）や、目を引く色（アクセントカラー）は、このベースの上で映える。土台が落ち着いていると、ほかの色が生きる」
配色の3つの役割
配色は、この3つの役割で考えると整理しやすくなります。メインカラーは、アソートカラー（ベースを引き立てる従の色）と呼ぶこともあります。
| 役割 | 面積の目安 | よく使われる場所 |
|---|---|---|
| ベースカラー | いちばん広い | 背景、余白、壁や床 |
| メインカラー | 次に広い | 見出し、帯、ブランドの色 |
| アクセントカラー | ほんの少し | ボタン、印、強調したい言葉 |
いいベースカラーとは
ベースカラーは面積が広いので、強すぎる色だと、見る人が疲れてしまいます。白や明るい灰色、生成りのような、明るくて彩度の低い色がよく選ばれます。ダークモードでは、暗い灰色や、深い色がベースになります。
真っ白より、ほんの少しだけ色みのある白をベースにすると、やわらかく、ほかの色ともなじみやすくなります。
- ベース 70%
- メイン 25%
- アクセント 5%
よくある勘違い
勘違いベースカラーは白にしておけば間違いない
ほんとうは白は無難ですが、少し色みのある白や灰色のほうが、全体がやわらかくまとまることもあります。
勘違いいちばん好きな色を、ベースにする
ほんとうは好きな色はメインやアクセントで生かし、ベースは落ち着いた色にすると、好きな色がいっそう映えます。
COLOR JOURNEY で使うには
COLOR JOURNEY のパレットでは、右端のいちばん明るい色が、ベースカラーの候補になります。ダークモードなら、左端のいちばん暗い色がベースになります。
参考になるパレット
クイズ
ベースカラーに選ばれやすいのは？
明るく彩度の低い色
正解です。答えは「明るく彩度の低い色」。面積が広いので、目に強すぎない落ち着いた色がよく選ばれます。
いちばん鮮やかな色
ちがいます。答えは「明るく彩度の低い色」。面積が広いので、目に強すぎない落ち着いた色がよく選ばれます。
補色
ちがいます。答えは「明るく彩度の低い色」。面積が広いので、目に強すぎない落ち着いた色がよく選ばれます。
配色で、いちばん面積が小さい役割は？
ベースカラー
ちがいます。答えは「アクセントカラー」。アクセントカラーは、ほんの少しだけ使います。
メインカラー
ちがいます。答えは「アクセントカラー」。アクセントカラーは、ほんの少しだけ使います。
アクセントカラー
正解です。答えは「アクセントカラー」。アクセントカラーは、ほんの少しだけ使います。
よくある質問
ベースカラーとは何ですか？
配色の中でいちばん広い面積を占め、全体の印象の土台になる色です。
ベースカラー・メインカラー・アクセントカラーの違いは？
ベースは土台の色、メインは主役の色、アクセントは目を引くための少しだけの色です。
アソートカラーとは何ですか？
ベースカラーを引き立てる従の色で、メインカラーとほぼ同じ意味で使われます。