狐色
きつねいろ | Fox
広色域(Display P3)比較
sRGB(従来のWeb標準)
#F6A522
Display P3(広色域)
color(display-p3 0.92 0.66 0.27)
意味と歴史
由来
狐の毛皮に見られる黄みの強い褐色に由来する。料理の世界で「きつね色に焼く」という表現が広く浸透しており、食材が理想的な焼き加減に達した状態を的確に伝える、日本語の中で最も日常的に使われる色名のひとつである。
歴史
「きつね色に焼く」という料理表現は江戸時代から使われ、天ぷらの衣や焼き魚、きつねうどんの油揚げなど日本の食文化に深く根付いている。稲荷神の使いである狐と油揚げの結びつきも、この色名の文化的な広がりを示す。
心理的効果
親しみやすさ、温かみ、食欲を刺激する効果を感じさせる。黄金色に焼き上がった食材を思わせるこの色は、家庭の台所の温もりと美味しい料理への期待を連想させ、見る者に幸福感と安心感を与える親しみ深い色である。
伝統的な用途
料理の焼き色の理想を示す表現として最も広く使われ、陶器の釉薬や秋の着物の色としても愛用された。現代ではベーカリーやカフェのインテリアカラーとしても人気があり、温かみのある空間演出に欠かせない色となっている。
CSSコード
HEX
#F6A522 RGB
rgb(246, 165, 34) CMYK
cmyk(0%, 33%, 86%, 4%) HSV
hsv(37, 86%, 96%) OKLCH
oklch(0.783 0.16 72.1) Display P3
color(display-p3 0.92 0.66 0.27) Munsell
2.5Y 7.4/14 フォールバック付きCSS
.element {
/* sRGBフォールバック */
background-color: #F6A522;
background-color: oklch(0.783 0.16 72.1);
}
@media (color-gamut: p3) {
.element {
background-color: color(display-p3 0.92 0.66 0.27);
}
} コントラストチェッカー
WCAG 2.1 基準に基づくコントラスト比を表示します。
白背景
2.03:1
黒背景
10.32:1
白文字
2.03:1
黒文字
10.32: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型)
赤色の感度が低下
#C1AA00
D型(2型)
緑色の感度が低下
#D4BE28
T型(3型)
青色の感度が低下
#FF908E
配色提案
補色
色相環の反対側
類似色
色相が近い色
トライアド
三角形の配色
スプリットコンプリメンタリー
補色の両隣
グラデーション
ティント(明るく)
background: linear-gradient(to right, #F6A522, #FFFFFF); シェード(暗く)
background: linear-gradient(to right, #F6A522, #000000); 透明へ
background: linear-gradient(to right, #F6A522, transparent); エクスポート
--color-kitsuneiro2: #F6A522;
--color-kitsuneiro2-rgb: 246, 165, 34;
--color-kitsuneiro2-oklch: 0.783 0.16 72.1; $color-kitsuneiro2: #F6A522;
$color-kitsuneiro2-rgb: rgb(246, 165, 34);
$color-kitsuneiro2-oklch: oklch(0.783 0.16 72.1); 'kitsuneiro2': '#F6A522', Color(red: 0.965, green: 0.647, blue: 0.133) {
"name": {
"ja": "狐色",
"en": "Fox",
"reading": "きつねいろ"
},
"hex": "#F6A522",
"rgb": {
"r": 246,
"g": 165,
"b": 34
},
"cmyk": {
"c": 0,
"m": 33,
"y": 86,
"k": 4
},
"oklch": {
"l": 0.783,
"c": 0.16,
"h": 72.1
},
"displayP3": {
"r": 0.92,
"g": 0.66,
"b": 0.27
},
"hsv": {
"h": 37,
"s": 86,
"v": 96
},
"munsell": "2.5Y 7.4/14"
}