Color con nombre · #F4E4E0
Rockabye Baby
Rockabye Baby es #F4E4E0: rgb(244 228 224), hsl(12 48% 92%), oklch(0.931 0.018 34.3). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Gray mean? → · Rockabye Baby color name →
#F4E4E0
oklch(0.931 0.018 34.3)
Conversiones de color
- HEX
- #f4e4e0
- RGB
- rgb(244 228 224)
- HSL
- hsl(12 48% 92%)
- HWB
- hwb(12 88% 4%)
- OKLCH
- oklch(0.931 0.018 34.3)
- OKLab
- oklab(0.931 0.015 0.01)
- CIE Lab
- lab(91.8 5.14 4.02)
- LCH
- lch(91.8 6.53 38)
- CMYK
- cmyk(0% 7% 8% 4%)
Tintes · Sombras · Tonos
Tintes
- F5E7E3
- F6E9E6
- F7ECE9
- F8EFEC
- FAF1EF
- FBF4F3
- FCF7F6
- FDFAF9
- FEFCFC
Sombras
- D4C6C3
- B5A9A6
- 978D8A
- 7A7270
- 5E5856
- 443F3E
- 2B2827
- 141212
- 030302
Tonos
- E8DAD6
- DCCFCC
- D0C5C2
- C4BBB8
- B8B1AF
- ADA7A5
- A19D9C
- 969392
- 8B8A89
Armonías de color
Complementario +180°
- F4E4E0
Rockabye Baby
- DBECF0
≈ Frost Wind
Análogo -30° +30°
- F4E4E0
Rockabye Baby
- F4E3E6
≈ Be Mine
- F1E6DC
≈ Fantasy
Triádico +120° +240°
- F4E4E0
Rockabye Baby
- DFECE3
≈ Country Mist
- E4E7F5
≈ Lavender Syrup
Complementario dividido +150° +210°
- F4E4E0
Rockabye Baby
- DBECE9
≈ Ice Folly
- DEEAF4
≈ Freeze Up
Tetrádico +90° +180° +270°
- F4E4E0
Rockabye Baby
- E5EADD
≈ Minified Mint
- DBECF0
≈ Frost Wind
- EBE5F2
≈ Modest Violet
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 1.23:1 · APCA Lc 12
Ag
AAASobre negro
WCAG 17.02:1 · APCA Lc 92
Mejor color de texto: #000000
WCAG 17.02:1 (AAA) · APCA Lc 92
Contrast pairs
Fragmentos de código
CSS
:root {
--rockabye-baby: #f4e4e0;
--rockabye-baby-rgb: 244 228 224;
--rockabye-baby-oklch: oklch(0.931 0.018 34.3);
}
.element {
color: var(--rockabye-baby);
background-color: hsl(12 48% 92%);
border-color: oklch(0.931 0.018 34.3);
}Tailwind CSS v4
@theme {
--color-rockabye-baby: #f4e4e0;
--color-rockabye-baby-50: #faf3f1;
--color-rockabye-baby-100: #eee6e4;
--color-rockabye-baby-200: #dcd2cf;
--color-rockabye-baby-300: #c0b4b1;
--color-rockabye-baby-400: #a99b97;
--color-rockabye-baby-500: #92827e;
--color-rockabye-baby-600: #7b6e6b;
--color-rockabye-baby-700: #635855;
--color-rockabye-baby-800: #49403e;
--color-rockabye-baby-900: #322c2b;
--color-rockabye-baby-950: #1e1918;
}SCSS
$rockabye-baby: #f4e4e0;
$rockabye-baby-rgb: 244, 228, 224;
$rockabye-baby-light: mix(#fff, $rockabye-baby, 20%);
$rockabye-baby-dark: mix(#000, $rockabye-baby, 20%);
.element {
color: $rockabye-baby;
box-shadow: 0 0 0 2px rgba($rockabye-baby, 0.35);
}