色名 · #F2E384

Electric Light Orchestra

Electric Light Orchestraは#F2E384：rgb(242 227 132)、hsl(52 81% 73%)、oklch(0.908 0.117 100.5)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。

What does Yellow mean? → · Electric Light Orchestra color name →

#F2E384

oklch(0.908 0.117 100.5)

カラー変換

HEX: #f2e384
RGB: rgb(242 227 132)
HSL: hsl(52 81% 73%)
HWB: hwb(52 52% 5%)
OKLCH: oklch(0.908 0.117 100.5)
OKLab: oklab(0.908 -0.021 0.115)
CIE Lab: lab(89.96 -3.96 48.06)
LCH: lch(89.96 48.22 94.7)
CMYK: cmyk(0% 6% 45% 5%)

ティント · シェード · トーン

ティント

F3E692
F4E99F
F6ECAC
F7EFB8
F8F2C5
FAF4D1
FBF7DC
FCFAE8
FEFCF4

シェード

D2C572
B4A860
968C4F
79713F
5E572F
433F20
2B2712
141206
030301

トーン

E6D985
DACF86
CEC586
C3BB86
B7B186
ACA785
A19D84
969383
8B8A82

カラーハーモニー

補色 +180°

F2E384
Electric Light Orchestra
DADEFF
≈ Transparent Blue

テトラード +90° +180° +270°

コントラストとアクセシビリティ

白の上

WCAG 1.30:1 · APCA Lc 15

Fail

黒の上

WCAG 16.09:1 · APCA Lc 89

AAA

最適な文字色: #000000

WCAG 16.09:1 (AAA) · APCA Lc 89

Contrast pairs

コードスニペット

CSS

:root {
  --electric-light-orchestra: #f2e384;
  --electric-light-orchestra-rgb: 242 227 132;
  --electric-light-orchestra-oklch: oklch(0.908 0.117 100.5);
}

.element {
  color: var(--electric-light-orchestra);
  background-color: hsl(52 81% 73%);
  border-color: oklch(0.908 0.117 100.5);
}

Tailwind CSS v4

@theme {
  --color-electric-light-orchestra: #f2e384;
  --color-electric-light-orchestra-50: #fbf7d1;
  --color-electric-light-orchestra-100: #efeabd;
  --color-electric-light-orchestra-200: #ddd79c;
  --color-electric-light-orchestra-300: #c3ba72;
  --color-electric-light-orchestra-400: #aea047;
  --color-electric-light-orchestra-500: #988700;
  --color-electric-light-orchestra-600: #81720a;
  --color-electric-light-orchestra-700: #675c0a;
  --color-electric-light-orchestra-800: #4d4204;
  --color-electric-light-orchestra-900: #352e03;
  --color-electric-light-orchestra-950: #211a00;
}

SCSS

$electric-light-orchestra: #f2e384;
$electric-light-orchestra-rgb: 242, 227, 132;
$electric-light-orchestra-light: mix(#fff, $electric-light-orchestra, 20%);
$electric-light-orchestra-dark: mix(#000, $electric-light-orchestra, 20%);

.element {
  color: $electric-light-orchestra;
  box-shadow: 0 0 0 2px rgba($electric-light-orchestra, 0.35);
}

近い色名

Palettes with similar colors

ツールで開く

ピッカーペアコントラストチェッカー Studio JSON API