色名 · #FEFF32
Bee Yellow
Bee Yellowは#FEFF32：rgb(254 255 50)、hsl(60 100% 60%)、oklch(0.968 0.201 109.9)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Yellow mean? → · Bee Yellow color name →
#FEFF32
oklch(0.968 0.201 109.9)
カラー変換
- HEX
- #feff32
- RGB
- rgb(254 255 50)
- HSL
- hsl(60 100% 60%)
- HWB
- hwb(60 20% 0%)
- OKLCH
- oklch(0.968 0.201 109.9)
- OKLab
- oklab(0.968 -0.069 0.189)
- CIE Lab
- lab(97.61 -15.61 86.85)
- LCH
- lch(97.61 88.24 100.2)
- CMYK
- cmyk(0% 0% 80% 0%)
ティント · シェード · トーン
ティント
- FEFF5A
- FEFF74
- FEFF8B
- FDFF9E
- FEFFB0
- FEFFC1
- FEFFD1
- FEFFE1
- FFFFF0
シェード
- DDDE2A
- BDBE22
- 9E9E1B
- 808014
- 63630D
- 474807
- 2D2E03
- 161601
- 030300
トーン
- F1F249
- E3E557
- D6D862
- C9CB6A
- BCBF71
- B0B276
- A3A57A
- 97997D
- 8C8C7F
カラーハーモニー
補色 +180°
- FEFF32
Bee Yellow
- F4F3FF
≈ Cloud Break
類似色 -30° +30°
- FEFF32
Bee Yellow
- FFF3DF
≈ Pale Pearl
- E0FFDA
≈ Transparent Green
トライアド +120° +240°
- FEFF32
Bee Yellow
- E8F7FF
≈ Clear Skies
- FFF0F6
≈ Lavender Blush
スプリットコンプリメンタリー +150° +210°
- FEFF32
Bee Yellow
- EFF5FF
≈ Placebo Blue
- FCF0FF
≈ Lovely Euphoric Delight
テトラード +90° +180° +270°
- FEFF32
Bee Yellow
- D7FDFF
≈ Salt Mountain
- F4F3FF
≈ Cloud Break
- FFF1F0
≈ Sefid White
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.07:1 · APCA Lc 0
Ag
AAA黒の上
WCAG 19.56:1 · APCA Lc 103
最適な文字色: #000000
WCAG 19.56:1 (AAA) · APCA Lc 103
Contrast pairs
コードスニペット
CSS
:root {
--bee-yellow: #feff32;
--bee-yellow-rgb: 254 255 50;
--bee-yellow-oklch: oklch(0.968 0.201 109.9);
}
.element {
color: var(--bee-yellow);
background-color: hsl(60 100% 60%);
border-color: oklch(0.968 0.201 109.9);
}Tailwind CSS v4
@theme {
--color-bee-yellow: #feff32;
--color-bee-yellow-50: #f6fcb9;
--color-bee-yellow-100: #e9efa0;
--color-bee-yellow-200: #d6dd72;
--color-bee-yellow-300: #bbc12a;
--color-bee-yellow-400: #a8a600;
--color-bee-yellow-500: #928d00;
--color-bee-yellow-600: #7b7700;
--color-bee-yellow-700: #626000;
--color-bee-yellow-800: #4b4500;
--color-bee-yellow-900: #343000;
--color-bee-yellow-950: #1f1c00;
}SCSS
$bee-yellow: #feff32;
$bee-yellow-rgb: 254, 255, 50;
$bee-yellow-light: mix(#fff, $bee-yellow, 20%);
$bee-yellow-dark: mix(#000, $bee-yellow, 20%);
.element {
color: $bee-yellow;
box-shadow: 0 0 0 2px rgba($bee-yellow, 0.35);
}