オッチル

おっちる | Ottchil

韓国の伝統色 黒系 三国時代 (紀元前57年〜)

広色域(Display P3)比較

sRGB(従来のWeb標準)

#1B1404

Display P3(広色域)

color(display-p3 0.101503 0.079471 0.023242)

意味と歴史

由来

韓国語で漆器を意味する「チルギ(chilgi)」に由来する。主成分はウルシ科の木(Toxicodendron vernicifluum)の樹液から得られるウルシオールをベースとした塗料である。現代では、伝統的な漆は「オッチル(otchil)」と呼ばれることがある。

出典(1件)

歴史

漆塗りの技術は三国時代(紀元前57年〜紀元後668年)に中国から朝鮮半島に伝わった。高麗時代(918年〜1392年)に黄金期を迎え、主に貴族階級で用いられた。朝鮮時代にはよりシンプルなデザインが好まれ、16世紀には庶民の間でも人気を博した。1960〜70年代には韓国の富の象徴とされた。

出典(1件)

伝統的な用途

当初は外国の使節や支配者への贈り物として用いられた。伝統的に、家具、装飾的な宝石箱、文房具箱、小さな食卓、化粧道具箱、皿や盆、小さな箪笥など、様々な工芸品の製作に広く使用されてきた。

出典(1件)

CSSコード

HEX

#1B1404

RGB

rgb(27, 20, 4)

CMYK

cmyk(0%, 25.93%, 85.19%, 89.41%)

HSV

hsv(41.7, 85.19%, 10.59%)

OKLCH

oklch(19.54% 0.0314 87.37)

Display P3

color(display-p3 0.101503 0.079471 0.023242)

Munsell

CIE XYZ

XYZ(0.00724, 0.00742, 0.0022)

CIE L*a*b*

Lab(6.703684, 0.767159, 8.412052)

CIE LCH(ab)

LCH(6.703684, 8.446961, 84.789173°)

CIE L*u*v*

Luv(6.703684, 2.926247, 5.692412)

Hunter Lab

Hunter Lab(8.614712, 0.003942, 0.042032)

xyY

xyY(0.429433, 0.440126, 0.00742)

JzAzBz

JzAzBz(0.001099, 0.000138, 0.000661)

JzCzHz

JzCzHz(0.001099, 0.000675, 78.235178°)

フォールバック付きCSS

.element {
  /* sRGBフォールバック */
  background-color: #1B1404;
  background-color: oklch(19.54% 0.0314 87.37);
}

@media (color-gamut: p3) {
  .element {
    background-color: color(display-p3 0.101503 0.079471 0.023242);
  }
}

コントラストチェッカー

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

サンプル

白背景

18.29:1

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

黒背景

1.15:1

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

白文字

18.29:1

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

黒文字

1.15: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型)

赤色の感度が低下

#171403

D型(2型)

緑色の感度が低下

#191604

T型(3型)

青色の感度が低下

#1E1210

配色提案

この配色は韓国の五方色(オバンセク)と陰陽五行の伝統的な色彩哲学に基づき、調和と均衡を重視した組み合わせを提案しています。

補色

Complementary

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

#1B1404
#FFFFFF

類似色

Analogous

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

#1B1404
#FFFFFF
#FFFFFF

トライアド

Triadic

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

#1B1404
#FFFFFF
#FFFFFF

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

Split-complementary

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

#1B1404
#FFFFFF
#FFFFFF

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

Tetradic (Square)

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

#1B1404
#FFFFFF
#FFFFFF
#FFFFFF

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

Tetradic (Rectangle)

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

#1B1404
#FFFFFF
#FFFFFF
#FFFFFF

モノクロマティック

Monochromatic

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

#1B1404
#F3EEE3
#FFFFFF
#F6EEDC

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

Double Complementary

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

#1B1404
#FFFFFF
#FFFFFF
#FFFFFF

グラデーション

ティント(明るく)

background: linear-gradient(to right, #1B1404, #FFFFFF);
#1B1404
#494336
#767268
#A4A19B
#D1D0CD
#FFFFFF

シェード(暗く)

background: linear-gradient(to right, #1B1404, #000000);
#1B1404
#161003
#100C02
#0B0802
#050401
#000000

透明へ

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

エクスポート

CSS変数
--color-ottchil: #1B1404;
--color-ottchil-rgb: 27, 20, 4;
--color-ottchil-oklch: 19.54% 0.0314 87.37;
Sass変数
$color-ottchil: #1B1404;
$color-ottchil-rgb: rgb(27, 20, 4);
$color-ottchil-oklch: oklch(19.54% 0.0314 87.37);
Tailwind Config
'ottchil': '#1B1404',
SwiftUI
Color(red: 0.106, green: 0.078, blue: 0.016)
JSON
{
  "name": {
    "ja": "オッチル",
    "en": "Ottchil",
    "reading": "おっちる",
    "ko": "옻칠"
  },
  "hex": "#1B1404",
  "rgb": {
    "r": 27,
    "g": 20,
    "b": 4
  },
  "cmyk": {
    "c": 0,
    "m": 25.93,
    "y": 85.19,
    "k": 89.41
  },
  "oklch": {
    "l": 19.54,
    "c": 0.0314,
    "h": 87.37
  },
  "displayP3": {
    "r": 0.101503,
    "g": 0.079471,
    "b": 0.023242
  },
  "hsv": {
    "h": 41.7,
    "s": 85.19,
    "v": 10.59
  },
  "munsell": ""
}