Couleur nommée la plus proche · #EFF2E0
#EFF2E0
Couleur nommée la plus proche: Bethlehem Superstar
#EFF2E0 (rgb(239 242 224), hsl(70 41% 91%), oklch(0.954 0.024 114.5)) est la plus proche de la couleur nommée Bethlehem Superstar. Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
#EFF2E0
oklch(0.954 0.024 114.5)
Conversions de couleur
- HEX
- #eff2e0
- RGB
- rgb(239 242 224)
- HSL
- hsl(70 41% 91%)
- HWB
- hwb(70 88% 5%)
- OKLCH
- oklch(0.954 0.024 114.5)
- OKLab
- oklab(0.954 -0.01 0.022)
- CIE Lab
- lab(94.9 -3.34 8.36)
- LCH
- lch(94.9 9 111.8)
- CMYK
- cmyk(1% 0% 7% 5%)
Teintes · Ombres · Tons
Teintes
- F1F3E3
- F2F5E6
- F4F6E9
- F5F7EC
- F7F9EF
- F9FAF3
- FAFBF6
- FCFCF9
- FDFEFC
Ombres
- D0D2C3
- B1B4A6
- 94968A
- 787970
- 5C5E56
- 42433E
- 2A2B27
- 141412
- 030302
Tons
- E3E6D6
- D8DACC
- CCCEC2
- C1C3B8
- B6B7AF
- ABACA5
- A0A19C
- 959692
- 8A8B89
Harmonies de couleurs
Complémentaire +180°
- EFF2E0
Bethlehem Superstar
- F0EDFF
≈ Foundation White
Analogue -30° +30°
- EFF2E0
Bethlehem Superstar
- F7EFDE
≈ Phoenix Villa
- E7F4E6
≈ Dinner Mint
Triadique +120° +240°
- EFF2E0
Bethlehem Superstar
- E1F3FE
≈ Wizard White
- FEEAF1
≈ Fairy Wings
Complémentaire divisée +150° +210°
- EFF2E0
Bethlehem Superstar
- E9F0FF
≈ Brilliant White
- F8EBF9
≈ Placebo Fuchsia
Tétradique +90° +180° +270°
- EFF2E0
Bethlehem Superstar
- DEF5F7
≈ Coastal Breeze
- F0EDFF
≈ Foundation White
- FFEAE8
≈ Quartz Light Pink
Contraste et accessibilité
Ag
FailSur blanc
WCAG 1.13:1 · APCA Lc 0
Ag
AAASur noir
WCAG 18.44:1 · APCA Lc 98
Meilleure couleur de texte: #000000
WCAG 18.44:1 (AAA) · APCA Lc 98
Contrast pairs
Extraits de code
CSS
:root {
--bethlehem-superstar: #eff2e0;
--bethlehem-superstar-rgb: 239 242 224;
--bethlehem-superstar-oklch: oklch(0.954 0.024 114.5);
}
.element {
color: var(--bethlehem-superstar);
background-color: hsl(70 41% 91%);
border-color: oklch(0.954 0.024 114.5);
}Tailwind CSS v4
@theme {
--color-bethlehem-superstar: #eff2e0;
--color-bethlehem-superstar-50: #f4f6ee;
--color-bethlehem-superstar-100: #e7e9e0;
--color-bethlehem-superstar-200: #d3d6ca;
--color-bethlehem-superstar-300: #b6b9ac;
--color-bethlehem-superstar-400: #9ea090;
--color-bethlehem-superstar-500: #858876;
--color-bethlehem-superstar-600: #717364;
--color-bethlehem-superstar-700: #5a5c50;
--color-bethlehem-superstar-800: #42433a;
--color-bethlehem-superstar-900: #2e2e28;
--color-bethlehem-superstar-950: #1b1b16;
}SCSS
$bethlehem-superstar: #eff2e0;
$bethlehem-superstar-rgb: 239, 242, 224;
$bethlehem-superstar-light: mix(#fff, $bethlehem-superstar, 20%);
$bethlehem-superstar-dark: mix(#000, $bethlehem-superstar, 20%);
.element {
color: $bethlehem-superstar;
box-shadow: 0 0 0 2px rgba($bethlehem-superstar, 0.35);
}