カラーパレット

ラベンダー

プロヴァンスのラベンダー畑をイメージした、青みをベースにしたさわやかな中間の紫です。休息やリラックスを連想させ、石けんやキャンドル、寝具に登場します。

別名：ラベンダー色, ラベンダーパープル

ラベンダー · #B57EDC

ラベンダーの基本情報

ラベンダー（#B57EDC）は、寒色系・中くらいの明るさ・中くらいの彩度の色です。紫系の色のグループに属します。RGBの値は赤181・緑126・青220（各255段階）。主な用途：インテリア, コスメ, ファッション。

ラベンダーの濃淡：明るいトーンと暗いトーン

明るい色から暗い色の順に並んでいます。色をタップするとカラーコードをコピーできます。

ラベンダーに合う色

グレー穏やかでモダンな組み合わせです。白爽やかで明るい印象に。セージグリーンラベンダー畑のように、ナチュラルでやわらかい組み合わせです。パステルイエローやわらかな補色のコントラストです。ネイビー深みと上品さを加えます。シルバー涼しげな輝きで引き立てます。くすみピンクロマンチックなパステルの組み合わせです。ミントグリーン爽やかで明るいパステル2色です。
ラベンダーのファッション・インテリアでの合わせ方 →

ラベンダーの配色ハーモニー

色相環にもとづいた配色です。配色ハーモニーツールでさらに多くのパターンを試せます。

補色近い色：ピスタチオグリーン
類似色近い色：オーキッド
トライアド近い色：キャメル, シーフォームグリーン
スプリット・コンプリメンタリー近い色：パステルイエロー, ライトグリーン
テトラード近い色：オールドローズ, ピスタチオグリーン, パステルターコイズ

ラベンダーを使ったカラーパレット

カラーコードをコピーするか、エディターで開いて自由に調整できます。

モノクロマティックパレット · ラベンダー
類似色パレット · ラベンダー
補色パレット · ラベンダー
トライアドパレット · ラベンダー
ニュートラルカラー入りパレット · ラベンダー
アクセントカラー入りパレット · ラベンダー

ラベンダーと文字色のコントラスト

白い文字コントラスト比 3.0:1 · AA（大きな文字）
黒い文字コントラスト比 7.0:1 · AA

WCAG 2.1の基準にもとづいています。ほかの色の組み合わせはコントラストチェッカーで確認できます。

CSSコード

:root {
  --lavender: #B57EDC;
  --lavender-rgb: 181, 126, 220;
}
.bg { background-color: var(--lavender); }
.text { color: var(--lavender); }

ラベンダーに近い色

アメジストオーキッドモーブ藤色プラムウルトラバイオレットロイヤルブルーライラックグレープネオンピンク

その他の紫系の色

バイオレット紫パープルライラックモーブプラムアメジスト茄子紺オーキッド藍色グレープ藤色パステルライラックウルトラバイオレット

よくある質問

ラベンダーのカラーコードは？

ラベンダーのHEXコードは#B57EDCです。RGBではrgb(181, 126, 220)、HSLではhsl(275, 57%, 68%)、CMYKでは18, 43, 0, 14となります。

ラベンダーの補色は何色ですか？

色相環で反対側にある補色は#A5DC7Eで、ピスタチオグリーンに近い色合いです。少量をアクセントとして使うと、強いコントラストが生まれます。

ラベンダーの上に白い文字を置いても読みやすいですか？

黒い文字のほうがおすすめです。白とのコントラスト比は3.0:1しかありませんが、黒とは7.0:1になります。

ラベンダーに合う色は？

相性のよい色：グレー, 白, セージグリーン, パステルイエロー, ネイビー。強いオレンジや赤と合わせると、ラベンダーのやわらかさが失われるので避けましょう。こげ茶と合わせると暗い印象になることがあります。