鸚鵡藍

Parrot Blue

中国の伝統色 蓝色系 唐代(618-907)

広色域(Display P3)比較

sRGB(従来のWeb標準)

#22B8CF

Display P3(広色域)

color(display-p3 0.35 0.71 0.8)

意味と歴史

由来

鸚鵡の羽の鮮やかな青色。中国の色彩文化は数千年の歴史を持ち、詩歌・絵画・陶磁器を通じて豊かな色名の体系を築いてきた。

歴史

唐代に西域から伝来した鸚鵡と結びつく色。唐代は詩歌と芸術が最盛期を迎え、色彩は文学作品や宮廷絵画を通じて豊かな象徴性を獲得した。

心理的効果

鮮やかさ、異国情緒、喜びを感じさせる。この色は中国の美意識の中で深い象徴性を持ち、詩歌や絵画にも多く描かれてきた。

伝統的な用途

花鳥画、七宝焼、磁器の装飾に使用された。中国の悠久の美意識の中で、工芸・絵画・建築に渡り幅広く活用されてきた。

CSSコード

HEX

#22B8CF

RGB

rgb(34, 184, 207)

CMYK

cmyk(84%, 11%, 0%, 19%)

HSV

hsv(188, 84%, 81%)

OKLCH

oklch(0.72 0.119 211.3)

Display P3

color(display-p3 0.35 0.71 0.8)

Munsell

10BG 6.9/6

フォールバック付きCSS

.element {
  /* sRGBフォールバック */
  background-color: #22B8CF;
  background-color: oklch(0.72 0.119 211.3);
}

@media (color-gamut: p3) {
  .element {
    background-color: color(display-p3 0.35 0.71 0.8);
  }
}

コントラストチェッカー

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

サンプル

白背景

2.38:1

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

黒背景

8.83:1

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

白文字

2.38:1

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

黒文字

8.83:1

AA Pass AAA Pass
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型)

赤色の感度が低下

#A6B1D0

D型(2型)

緑色の感度が低下

#8FA1CF

T型(3型)

青色の感度が低下

#00C2BF

配色提案

補色

色相環の反対側

類似色

色相が近い色

トライアド

三角形の配色

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

補色の両隣

グラデーション

ティント(明るく)

background: linear-gradient(to right, #22B8CF, #FFFFFF);
#22B8CF
#4EC6D9
#7AD4E2
#A7E3EC
#D3F1F5
#FFFFFF

シェード(暗く)

background: linear-gradient(to right, #22B8CF, #000000);
#22B8CF
#1B93A6
#146E7C
#0E4A53
#072529
#000000

透明へ

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

エクスポート

CSS変数
--color-yingluolan: #22B8CF;
--color-yingluolan-rgb: 34, 184, 207;
--color-yingluolan-oklch: 0.72 0.119 211.3;
Sass変数
$color-yingluolan: #22B8CF;
$color-yingluolan-rgb: rgb(34, 184, 207);
$color-yingluolan-oklch: oklch(0.72 0.119 211.3);
Tailwind Config
'yingluolan': '#22B8CF',
SwiftUI
Color(red: 0.133, green: 0.722, blue: 0.812)
JSON
{
  "name": {
    "ja": "鸚鵡藍",
    "en": "Parrot Blue",
    "zh": "鹦鹉蓝"
  },
  "hex": "#22B8CF",
  "rgb": {
    "r": 34,
    "g": 184,
    "b": 207
  },
  "cmyk": {
    "c": 84,
    "m": 11,
    "y": 0,
    "k": 19
  },
  "oklch": {
    "l": 0.72,
    "c": 0.119,
    "h": 211.3
  },
  "displayP3": {
    "r": 0.35,
    "g": 0.71,
    "b": 0.8
  },
  "hsv": {
    "h": 188,
    "s": 84,
    "v": 81
  },
  "munsell": "10BG 6.9/6"
}

関連する色

他の文化圏の類似色