赤白橡

あかしろつるばみ | Red Oak

日本の伝統色 茶系 平安時代(794-1185)

広色域(Display P3)比較

sRGB(従来のWeb標準)

#B5725C

Display P3(広色域)

color(display-p3 0.67 0.46 0.38)

意味と歴史

由来

橡(つるばみ・クヌギ)の実で染めた色に赤みを加えた茶褐色。「白橡」に紅花や茜で赤みを重ねて染めた色で、律令制度の位階色のひとつとして厳格に規定された、平安時代の染色技法が生んだ色名である。

歴史

平安時代の位階色として定められ、延喜式にもその染色法が記録されている。橡染めは身近なクヌギの実を使う堅牢な染色法で、その上に赤みを加えた赤白橡は、中位の官人が着用する装束の色として規定されていた。

心理的効果

温かみ、素朴さ、穏やかな安定感を感じさせる。赤みを帯びた茶色は大地の温もりと秋の実りを連想させ、自然の恵みに感謝する穏やかな心持ちと、地に足のついた堅実な生き方を象徴する落ち着いた色である。

伝統的な用途

平安時代の官人の装束の染め色として規定され、位階に応じた正装に用いられた。現代では伝統的な草木染めの色として復元され、自然素材を活かした工芸品や、秋を感じる和装の色として愛好家に大切にされている色である。

CSSコード

HEX

#B5725C

RGB

rgb(181, 114, 92)

CMYK

cmyk(0%, 37%, 49%, 29%)

HSV

hsv(15, 49%, 71%)

OKLCH

oklch(0.618 0.091 38.9)

Display P3

color(display-p3 0.67 0.46 0.38)

Munsell

2.5YR 5.5/6

フォールバック付きCSS

.element {
  /* sRGBフォールバック */
  background-color: #B5725C;
  background-color: oklch(0.618 0.091 38.9);
}

@media (color-gamut: p3) {
  .element {
    background-color: color(display-p3 0.67 0.46 0.38);
  }
}

コントラストチェッカー

WCAG 2.1 基準に基づくコントラスト比を表示します。

サンプル

白背景

3.80:1

AA Fail AAA Fail
AA大文字 Pass
サンプル

黒背景

5.53:1

AA Pass AAA Fail
AA大文字 Pass
サンプル

白文字

3.80:1

AA Fail AAA Fail
AA大文字 Pass
サンプル

黒文字

5.53:1

AA Pass AAA Fail
AA大文字 Pass

配色シミュレーター

この色を背景やテキストに使用した場合のプレビューです。

背景色として使用

白テキスト — 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.

UIコンポーネントでの使用例
バッジ

色覚シミュレーション

P型(1型)

赤色の感度が低下

#837A5A

D型(2型)

緑色の感度が低下

#93885B

T型(3型)

青色の感度が低下

#C3676C

配色提案

補色

色相環の反対側

類似色

色相が近い色

トライアド

三角形の配色

スプリットコンプリメンタリー

補色の両隣

グラデーション

ティント(明るく)

background: linear-gradient(to right, #B5725C, #FFFFFF);
#B5725C
#C48E7D
#D3AA9D
#E1C7BE
#F0E3DE
#FFFFFF

シェード(暗く)

background: linear-gradient(to right, #B5725C, #000000);
#B5725C
#915B4A
#6D4437
#482E25
#241712
#000000

透明へ

background: linear-gradient(to right, #B5725C, transparent);

エクスポート

CSS変数
--color-akashirotsuchi: #B5725C;
--color-akashirotsuchi-rgb: 181, 114, 92;
--color-akashirotsuchi-oklch: 0.618 0.091 38.9;
Sass変数
$color-akashirotsuchi: #B5725C;
$color-akashirotsuchi-rgb: rgb(181, 114, 92);
$color-akashirotsuchi-oklch: oklch(0.618 0.091 38.9);
Tailwind Config
'akashirotsuchi': '#B5725C',
SwiftUI
Color(red: 0.710, green: 0.447, blue: 0.361)
JSON
{
  "name": {
    "ja": "赤白橡",
    "en": "Red Oak",
    "reading": "あかしろつるばみ"
  },
  "hex": "#B5725C",
  "rgb": {
    "r": 181,
    "g": 114,
    "b": 92
  },
  "cmyk": {
    "c": 0,
    "m": 37,
    "y": 49,
    "k": 29
  },
  "oklch": {
    "l": 0.618,
    "c": 0.091,
    "h": 38.9
  },
  "displayP3": {
    "r": 0.67,
    "g": 0.46,
    "b": 0.38
  },
  "hsv": {
    "h": 15,
    "s": 49,
    "v": 71
  },
  "munsell": "2.5YR 5.5/6"
}

関連する色

他の文化圏の類似色