カドミウムイエロー

かどみうむいえろー | Cadmium Yellow

近代・産業色黄系 1817年〜

顔料 19世紀産業革命ヨーロッパ硫化カドミウム絵具油彩水彩毒性

広色域（Display P3）比較

sRGB（従来のWeb標準）

#FFF600

Display P3（広色域）

color(display-p3 0.9939 0.9659 0.3205)

意味と歴史

由来

1817年に発見された元素カドミウムに由来する色名。主成分は硫化カドミウム（CdS）である。元素名はラテン語でカラミン（菱亜鉛鉱）を意味する「cadmia」にちなんで名付けられた。この顔料は、レモンイエローからオレンジまで幅広い色合いを呈する。

出典（2件）

歴史

1817年に金属カドミウムが発見された後、金属の希少性から生産が遅れ、1840年頃に画家用顔料として初めて導入された。産業革命期のヨーロッパで開発された新しい黄色顔料の一つであり、優れた耐光性、不透明度、着色力から、現在でも広く使用されている。

出典（2件）

伝統的な用途

19世紀から油彩や水彩の画家用顔料として使用されてきた。鮮やかで着色力が強いが、銅ベースの顔料とは混合できなかった。現在市場に出回っている顔料の中でも特に毒性が高いものの一つとして知られる。

出典（1件）

Exploring Cadmium Colors: History, Science, and Artistic Application

CSSコード

HEX

#FFF600

RGB

rgb(255, 246, 0)

CMYK

cmyk(0%, 3.5%, 100%, 0%)

HSV

hsv(57.9, 100%, 100%)

OKLCH

oklch(94.94% 0.2035 107)

Display P3

color(display-p3 0.9939 0.9659 0.3205)

Munsell

CIE XYZ

XYZ(0.74199, 0.87174, 0.12918)

CIE L*a*b*

Lab(94.81, -17.25, 92.78)

CIE LCH(ab)

LCH(94.81, 94.37, 100.53°)

CIE L*u*v*

Luv(94.81, 13.67, 103.48)

Hunter Lab

Hunter Lab(93.37, -16.81, 54.2)

xyY

xyY(0.42572, 0.50016, 0.87174)

JzAzBz

JzAzBz(0.20524, -0.023463, 0.133595)

JzCzHz

JzCzHz(0.20524, 0.135639, 99.96°)

フォールバック付きCSS

.element {
  /* sRGBフォールバック */
  background-color: #FFF600;
  background-color: oklch(94.94% 0.2035 107);
}

@media (color-gamut: p3) {
  .element {
    background-color: color(display-p3 0.9939 0.9659 0.3205);
  }
}

コントラストチェッカー

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

サンプル

白背景

1.14:1

AA Fail AAA Fail

AA大文字 Fail

サンプル

黒背景

18.43:1

AA Pass AAA Pass

AA大文字 Pass

サンプル

白文字

1.14:1

AA Fail AAA Fail

AA大文字 Fail

サンプル

黒文字

18.43: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型）

赤色の感度が低下

#FFEC00

D型（2型）

緑色の感度が低下

#FFF32E

T型（3型）

青色の感度が低下

#FFE4D2

配色提案

この配色は現代のデザインシステムにおける色彩理論と、ユニバーサルデザインのアクセシビリティ原則に基づいています。

補色

Complementary

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

#FFF600

#FFFFFF

類似色

Analogous

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

#FFF600

#FFFFFF

トライアド

Triadic

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

#FFF600

#FFFFFF

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

Split-complementary

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

#FFF600

#FFFFFF

テトラディック（正方形）

Tetradic (Square)

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

#FFF600

#FFFFFF

テトラディック（長方形）

Tetradic (Rectangle)

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

#FFF600

#FFFFFF

モノクロマティック

Monochromatic

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

#FFF600

#F6F4A3

#FFFFFF

#FBF666

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

Double Complementary

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

#FFF600

#FFFFFF

グラデーション

ティント（明るく）

background: linear-gradient(to right, #FFF600, #FFFFFF);

#FFF600

#FFF833

#FFFA66

#FFFB99

#FFFDCC

#FFFFFF

シェード（暗く）

background: linear-gradient(to right, #FFF600, #000000);

#FFF600

#CCC500

#999400

#666200

#333100

#000000

透明へ

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

エクスポート

CSS変数

--color-cadmium_yellow: #FFF600;
--color-cadmium_yellow-rgb: 255, 246, 0;
--color-cadmium_yellow-oklch: 94.94% 0.2035 107;

Sass変数

$color-cadmium_yellow: #FFF600;
$color-cadmium_yellow-rgb: rgb(255, 246, 0);
$color-cadmium_yellow-oklch: oklch(94.94% 0.2035 107);

Tailwind Config

'cadmium_yellow': '#FFF600',

SwiftUI

Color(red: 1.000, green: 0.965, blue: 0.000)

JSON

{
  "name": {
    "ja": "カドミウムイエロー",
    "en": "Cadmium Yellow",
    "reading": "かどみうむいえろー"
  },
  "hex": "#FFF600",
  "rgb": {
    "r": 255,
    "g": 246,
    "b": 0
  },
  "cmyk": {
    "c": 0,
    "m": 3.5,
    "y": 100,
    "k": 0
  },
  "oklch": {
    "l": 94.94,
    "c": 0.2035,
    "h": 107
  },
  "displayP3": {
    "r": 0.9939,
    "g": 0.9659,
    "b": 0.3205
  },
  "hsv": {
    "h": 57.9,
    "s": 100,
    "v": 100
  },
  "munsell": ""
}