パチャママ・ブラウン

Pachamama Brown

広色域(Display P3)比較

sRGB(従来のWeb標準)

#6B4423

Display P3(広色域)

color(display-p3 0.397619 0.273433 0.160064)

意味と歴史

由来

アンデス地方の人々に崇拝される神、パチャママに由来する。インカ神話における「母なる女神」であり、時空を象徴する存在として知られる。彼女は万物を繋ぐ普遍的なエネルギーの象徴とされる。

出典(1件)

CSSコード

HEX

#6B4423

RGB

rgb(107, 68, 35)

CMYK

cmyk(0%, 36.45%, 67.29%, 58.04%)

HSV

hsv(27.5, 67.29%, 41.96%)

OKLCH

oklch(42.44% 0.0717 59.27)

Display P3

color(display-p3 0.397619 0.273433 0.160064)

Munsell

CIE XYZ

XYZ(0.08434, 0.07382, 0.0257)

CIE L*a*b*

Lab(32.661506, 13.271919, 26.525298)

CIE LCH(ab)

LCH(32.661506, 29.660331, 63.418933°)

CIE L*u*v*

Luv(32.661506, 28.901866, 23.484866)

Hunter Lab

Hunter Lab(27.170106, 0.094638, 0.123896)

xyY

xyY(0.458718, 0.401485, 0.07382)

JzAzBz

JzAzBz(0.003249, 0.002176, 0.003667)

JzCzHz

JzCzHz(0.003249, 0.004265, 59.315823°)

フォールバック付きCSS

.element {
  /* sRGBフォールバック */
  background-color: #6B4423;
  background-color: oklch(42.44% 0.0717 59.27);
}

@media (color-gamut: p3) {
  .element {
    background-color: color(display-p3 0.397619 0.273433 0.160064);
  }
}

コントラストチェッカー

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

サンプル

白背景

8.48:1

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

黒背景

2.48:1

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

白文字

8.48:1

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

黒文字

2.48:1

AA Fail AAA Fail
AA大文字 Fail

配色シミュレーター

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

背景色として使用

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

赤色の感度が低下

#504820

D型(2型)

緑色の感度が低下

#595023

T型(3型)

青色の感度が低下

#753C3C

配色提案

この配色はマヤ・アステカの宇宙観に基づく色彩体系と、アンデス織物の伝統的な配色パターンを参照しています。

補色

Complementary

色相環の反対側に位置する色。最も強いコントラストを生む

#6B4423
#FFFFFF

類似色

Analogous

色相が近い色の組み合わせ。自然で調和的な印象を与える

#6B4423
#FFFFFF
#FFFFFF

トライアド

Triadic

色相環を三等分する配色。活力がありバランスの良い組み合わせ

#6B4423
#FFFFFF
#FFFFFF

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

Split-complementary

補色の両隣を使う配色。補色より柔らかいコントラスト

#6B4423
#FFFFFF
#FFFFFF

テトラディック(正方形)

Tetradic (Square)

色相環を四等分する配色。豊かな色彩で華やかな印象

#6B4423
#FFFFFF
#FFFFFF
#FFFFFF

テトラディック(長方形)

Tetradic (Rectangle)

二対の補色を組み合わせた配色。多彩ながらまとまりのある配色

#6B4423
#FFFFFF
#FFFFFF
#FFFFFF

モノクロマティック

Monochromatic

同じ色相で明度・彩度を変えた配色。統一感のある上品な印象

#6B4423
#FFE9D7
#FFFFFF
#FFE6C9

ダブルコンプリメンタリー

Double Complementary

隣り合う二色とその補色による四色配色。複雑で魅力的な配色

#6B4423
#FFFFFF
#FFFFFF
#FFFFFF

グラデーション

ティント(明るく)

background: linear-gradient(to right, #6B4423, #FFFFFF);
#6B4423
#89694F
#A68F7B
#C4B4A7
#E1DAD3
#FFFFFF

シェード(暗く)

background: linear-gradient(to right, #6B4423, #000000);
#6B4423
#56361C
#402915
#2B1B0E
#150E07
#000000

透明へ

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

エクスポート

CSS変数
--color-pachamama_brown: #6B4423;
--color-pachamama_brown-rgb: 107, 68, 35;
--color-pachamama_brown-oklch: 42.44% 0.0717 59.27;
Sass変数
$color-pachamama_brown: #6B4423;
$color-pachamama_brown-rgb: rgb(107, 68, 35);
$color-pachamama_brown-oklch: oklch(42.44% 0.0717 59.27);
Tailwind Config
'pachamama_brown': '#6B4423',
SwiftUI
Color(red: 0.420, green: 0.267, blue: 0.137)
JSON
{
  "name": {
    "ja": "パチャママ・ブラウン",
    "en": "Pachamama Brown"
  },
  "hex": "#6B4423",
  "rgb": {
    "r": 107,
    "g": 68,
    "b": 35
  },
  "cmyk": {
    "c": 0,
    "m": 36.45,
    "y": 67.29,
    "k": 58.04
  },
  "oklch": {
    "l": 42.44,
    "c": 0.0717,
    "h": 59.27
  },
  "displayP3": {
    "r": 0.397619,
    "g": 0.273433,
    "b": 0.160064
  },
  "hsv": {
    "h": 27.5,
    "s": 67.29,
    "v": 41.96
  },
  "munsell": ""
}