カラーパレット

マスタード

マスタードをイメージした、少し茶色がかった濃い黄色です。秋服やレトロなアームチェアで人気の色です。グレーやネイビー、白と美しく調和します。

別名:マスタードイエロー, からし色

マスタード · #E1AD01

マスタードの基本情報

マスタード(#E1AD01)は、暖色系・中くらいの明るさ・鮮やかの色です。黄色系の色のグループに属します。RGBの値は赤225・緑173・青1(各255段階)。主な用途:ファッション, インテリア。

マスタードの濃淡:明るいトーンと暗いトーン

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

マスタードに合う色

ネイビー暖色と寒色の、とても上品なコントラストです。グレーグレーがマスタードを落ち着かせ、モダンに見せます。オリーブグリーンナチュラルで秋らしい組み合わせです。コーヒーブラウン居心地のよいアースカラーの配色になります。白フレッシュで清潔感のある印象にします。紫補色に近く、大胆なコントラストになります。ペトロールブルー強さと洗練を兼ねた組み合わせです。黒力強くモダンなコントラストです。
マスタードのファッション・インテリアでの合わせ方 →

マスタードの配色ハーモニー

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

補色近い色:紫
トライアド近い色:アクアマリン, バイオレット
スプリット・コンプリメンタリー近い色:スチールブルー, 青

マスタードを使ったカラーパレット

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

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

マスタードと文字色のコントラスト

白い文字コントラスト比 2.1:1 · 非推奨
黒い文字コントラスト比 10.2:1 · AAA

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

CSSコード

:root {
  --mustard-yellow: #E1AD01;
  --mustard-yellow-rgb: 225, 173, 1;
}
.bg { background-color: var(--mustard-yellow); }
.text { color: var(--mustard-yellow); }

マスタードに近い色

サフラン琥珀色ひまわり色ハニーキャラメルオールドゴールドパステルオレンジゴールドキャロットオレンジコーンイエロー

この色を使ったテーマ別パレット

その他の黄色系の色

黄色ゴールドオールドゴールドレモンイエロー琥珀色小麦色ハニーカナリアイエローサフランシャンパンパステルイエロー蛍光イエローコーンイエローひまわり色

よくある質問

マスタードのカラーコードは?

マスタードのHEXコードは#E1AD01です。RGBではrgb(225, 173, 1)、HSLではhsl(46, 99%, 44%)、CMYKでは0, 23, 100, 12となります。

マスタードの補色は何色ですか?

色相環で反対側にある補色は#0135E1で、紫に近い色合いです。少量をアクセントとして使うと、強いコントラストが生まれます。

マスタードの上に白い文字を置いても読みやすいですか?

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

マスタードに合う色は?

相性のよい色:ネイビー, グレー, オリーブグリーン, コーヒーブラウン, 白。レモンイエローやライムグリーンと合わせると、マスタードが汚れて見えるので避けましょう。鮮やかなオレンジも競合します。