Benannte Farbe · #FFEAAC
Yellow Canary
Yellow Canary ist #FFEAAC: rgb(255 234 172), hsl(45 100% 84%), oklch(0.94 0.082 91.6). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Yellow mean? → · Yellow Canary color name →
#FFEAAC
oklch(0.94 0.082 91.6)
Farbumrechnungen
- HEX
- #ffeaac
- RGB
- rgb(255 234 172)
- HSL
- hsl(45 100% 84%)
- HWB
- hwb(45 67% 0%)
- OKLCH
- oklch(0.94 0.082 91.6)
- OKLab
- oklab(0.94 -0.002 0.082)
- CIE Lab
- lab(93.34 0.88 32.93)
- LCH
- lch(93.34 32.94 88.5)
- CMYK
- cmyk(0% 8% 33% 0%)
Tints · Shades · Tones
Tints
- FFECB5
- FFEEBD
- FFF1C6
- FFF3CE
- FFF5D7
- FFF7DF
- FFF9E7
- FFFBEF
- FFFDF7
Shades
- DECB95
- BEAE7F
- 9E9169
- 807554
- 635A40
- 48412D
- 2E291B
- 16130B
- 030301
Tones
- F2DFA8
- E4D4A4
- D7C9A0
- CABE9B
- BEB497
- B1A993
- A49F8E
- 989489
- 8C8A85
Farbharmonien
Komplementär +180°
- FFEAAC
Yellow Canary
- E4EAFF
≈ Glitter
Analog -30° +30°
- FFEAAC
Yellow Canary
- FFE6D1
≈ Naive Peach
- E2F4B7
≈ Spring Kiss
Triadisch +120° +240°
- FFEAAC
Yellow Canary
- C4F5FF
≈ Pale Sky
- FFE0FA
≈ Fairy Salt
Geteilt komplementär +150° +210°
- FFEAAC
Yellow Canary
- D9EEFF
≈ Calcareous Sinter
- EFE6FF
≈ Holographic Lavender
Tetradisch +90° +180° +270°
- FFEAAC
Yellow Canary
- ACFEEF
≈ Blister Pearl
- E4EAFF
≈ Glitter
- FFE3E9
≈ Early Blossom
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.19:1 · APCA Lc 9
Ag
AAAAuf Schwarz
WCAG 17.61:1 · APCA Lc 95
Beste Textfarbe: #000000
WCAG 17.61:1 (AAA) · APCA Lc 95
Contrast pairs
Code-Snippets
CSS
:root {
--yellow-canary: #ffeaac;
--yellow-canary-rgb: 255 234 172;
--yellow-canary-oklch: oklch(0.94 0.082 91.6);
}
.element {
color: var(--yellow-canary);
background-color: hsl(45 100% 84%);
border-color: oklch(0.94 0.082 91.6);
}Tailwind CSS v4
@theme {
--color-yellow-canary: #ffeaac;
--color-yellow-canary-50: #fdf5db;
--color-yellow-canary-100: #f1e8ca;
--color-yellow-canary-200: #e0d4ad;
--color-yellow-canary-300: #c5b787;
--color-yellow-canary-400: #b09d65;
--color-yellow-canary-500: #9a8442;
--color-yellow-canary-600: #827039;
--color-yellow-canary-700: #685a2d;
--color-yellow-canary-800: #4e411f;
--color-yellow-canary-900: #362d14;
--color-yellow-canary-950: #211a06;
}SCSS
$yellow-canary: #ffeaac;
$yellow-canary-rgb: 255, 234, 172;
$yellow-canary-light: mix(#fff, $yellow-canary, 20%);
$yellow-canary-dark: mix(#000, $yellow-canary, 20%);
.element {
color: $yellow-canary;
box-shadow: 0 0 0 2px rgba($yellow-canary, 0.35);
}