Colore con nome · #F4EABA
Yellow Bliss
Yellow Bliss è #F4EABA: rgb(244 234 186), hsl(50 73% 84%), oklch(0.933 0.063 97.6). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Yellow mean? → · Yellow Bliss color name →
#F4EABA
oklch(0.933 0.063 97.6)
Conversioni di colore
- HEX
- #f4eaba
- RGB
- rgb(244 234 186)
- HSL
- hsl(50 73% 84%)
- HWB
- hwb(50 73% 4%)
- OKLCH
- oklch(0.933 0.063 97.6)
- OKLab
- oklab(0.933 -0.008 0.063)
- CIE Lab
- lab(92.61 -1.97 24.7)
- LCH
- lch(92.61 24.78 94.6)
- CMYK
- cmyk(0% 4% 24% 4%)
Tinte · Ombre · Toni
Tinte
- F5ECC1
- F6EEC8
- F7F0CF
- F8F3D6
- F9F5DD
- FBF7E4
- FCF9EB
- FDFBF1
- FEFDF8
Ombre
- D4CBA1
- B5AE89
- 979172
- 7A755C
- 5E5A46
- 444132
- 2B291E
- 14130D
- 030302
Toni
- E8DFB4
- DCD4AF
- D0C9A9
- C4BEA3
- B8B49D
- ADA997
- A19F92
- 96948C
- 8B8A86
Armonie di colore
Complementare +180°
- F4EABA
Yellow Bliss
- E3E7FF
≈ Cyber Lavender
Analogo -30° +30°
- F4EABA
Yellow Bliss
- FFE4C8
≈ Apple Crunch
- DDF2C5
≈ Green Veil
Triadico +120° +240°
- F4EABA
Yellow Bliss
- C5F2FF
≈ Heaven’s Gate
- FFDDF4
≈ Silky Pink
Complementare divisa +150° +210°
- F4EABA
Yellow Bliss
- D8ECFF
≈ Hoarfrost
- F0E2FF
≈ Lavender Savour
Tetradico +90° +180° +270°
- F4EABA
Yellow Bliss
- B9F7F0
≈ Ice Citadel
- E3E7FF
≈ Cyber Lavender
- FFE0E4
≈ Pink Pleasure
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 1.21:1 · APCA Lc 10
Ag
AAASu nero
WCAG 17.32:1 · APCA Lc 94
Miglior colore del testo: #000000
WCAG 17.32:1 (AAA) · APCA Lc 94
Contrast pairs
Frammenti di codice
CSS
:root {
--yellow-bliss: #f4eaba;
--yellow-bliss-rgb: 244 234 186;
--yellow-bliss-oklch: oklch(0.933 0.063 97.6);
}
.element {
color: var(--yellow-bliss);
background-color: hsl(50 73% 84%);
border-color: oklch(0.933 0.063 97.6);
}Tailwind CSS v4
@theme {
--color-yellow-bliss: #f4eaba;
--color-yellow-bliss-50: #f9f6e2;
--color-yellow-bliss-100: #ede9d1;
--color-yellow-bliss-200: #dad5b7;
--color-yellow-bliss-300: #bfb994;
--color-yellow-bliss-400: #a89f74;
--color-yellow-bliss-500: #918755;
--color-yellow-bliss-600: #7b7249;
--color-yellow-bliss-700: #625b3a;
--color-yellow-bliss-800: #494229;
--color-yellow-bliss-900: #332e1b;
--color-yellow-bliss-950: #1e1b0c;
}SCSS
$yellow-bliss: #f4eaba;
$yellow-bliss-rgb: 244, 234, 186;
$yellow-bliss-light: mix(#fff, $yellow-bliss, 20%);
$yellow-bliss-dark: mix(#000, $yellow-bliss, 20%);
.element {
color: $yellow-bliss;
box-shadow: 0 0 0 2px rgba($yellow-bliss, 0.35);
}