CSSダークサーモン
CSS Dark Salmon
広色域(Display P3)比較
sRGB(従来のWeb標準)
#E9967A
Display P3(広色域)
color(display-p3 0.87 0.6 0.5)
意味と歴史
由来
英語 dark salmon(暗いサーモン色)に由来する。鮭の身の色を暗くした色合いで、焼いた鮭のような深みのあるピンクオレンジを指す。
歴史
X11カラーネームとして#E9967Aで定義された。salmon系の色名は食品の色に基づいており、CSS3でも3種類のサーモン色が登録されている。
心理的効果
親しみやすさと温かさを感じさせ、社交的で明るい雰囲気を演出する。柔らかいエネルギーと優しさを伝える色。
伝統的な用途
飲食店やレシピサイトのアクセントカラーとして人気がある。ファッションECサイトやライフスタイル系メディアのデザインにも活用される。
CSSコード
HEX
#E9967A RGB
rgb(233, 150, 122) CMYK
cmyk(0%, 36%, 48%, 9%) HSV
hsv(15, 48%, 91%) OKLCH
oklch(0.751 0.108 39.4) Display P3
color(display-p3 0.87 0.6 0.5) Munsell
2.5YR 7/8 フォールバック付きCSS
.element {
/* sRGBフォールバック */
background-color: #E9967A;
background-color: oklch(0.751 0.108 39.4);
}
@media (color-gamut: p3) {
.element {
background-color: color(display-p3 0.87 0.6 0.5);
}
} コントラストチェッカー
WCAG 2.1 基準に基づくコントラスト比を表示します。
白背景
2.31:1
黒背景
9.11:1
白文字
2.31:1
黒文字
9.11:1
配色シミュレーター
この色を背景やテキストに使用した場合のプレビューです。
白テキスト — The quick brown fox
黒テキスト — The quick brown fox
色の上にテキストを配置した場合の可読性を確認できます。見出し・本文・リンクなど、さまざまなサイズで試してみてください。
白背景 — 見出しテキスト
本文テキストのサンプルです。The quick brown fox jumps over the lazy dog.
黒背景 — 見出しテキスト
本文テキストのサンプルです。The quick brown fox jumps over the lazy dog.
色覚シミュレーション
P型(1型)
赤色の感度が低下
#ABA078
D型(2型)
緑色の感度が低下
#BEB279
T型(3型)
青色の感度が低下
#FB898F
配色提案
補色
色相環の反対側
類似色
色相が近い色
トライアド
三角形の配色
スプリットコンプリメンタリー
補色の両隣
グラデーション
ティント(明るく)
background: linear-gradient(to right, #E9967A, #FFFFFF); シェード(暗く)
background: linear-gradient(to right, #E9967A, #000000); 透明へ
background: linear-gradient(to right, #E9967A, transparent); エクスポート
--color-css_dark_salmon: #E9967A;
--color-css_dark_salmon-rgb: 233, 150, 122;
--color-css_dark_salmon-oklch: 0.751 0.108 39.4; $color-css_dark_salmon: #E9967A;
$color-css_dark_salmon-rgb: rgb(233, 150, 122);
$color-css_dark_salmon-oklch: oklch(0.751 0.108 39.4); 'css_dark_salmon': '#E9967A', Color(red: 0.914, green: 0.588, blue: 0.478) {
"name": {
"ja": "CSSダークサーモン",
"en": "CSS Dark Salmon"
},
"hex": "#E9967A",
"rgb": {
"r": 233,
"g": 150,
"b": 122
},
"cmyk": {
"c": 0,
"m": 36,
"y": 48,
"k": 9
},
"oklch": {
"l": 0.751,
"c": 0.108,
"h": 39.4
},
"displayP3": {
"r": 0.87,
"g": 0.6,
"b": 0.5
},
"hsv": {
"h": 15,
"s": 48,
"v": 91
},
"munsell": "2.5YR 7/8"
}