Couleur nommée · #FEE5BA
Butter Creme
Butter Creme correspond à #FEE5BA : rgb(254 229 186), hsl(38 97% 86%), oklch(0.932 0.062 81.2). Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
What does Orange mean? → · Butter Creme color name →
#FEE5BA
oklch(0.932 0.062 81.2)
Conversions de couleur
- HEX
- #fee5ba
- RGB
- rgb(254 229 186)
- HSL
- hsl(38 97% 86%)
- HWB
- hwb(38 73% 0%)
- OKLCH
- oklch(0.932 0.062 81.2)
- OKLab
- oklab(0.932 0.01 0.061)
- CIE Lab
- lab(92.22 4.18 24.34)
- LCH
- lch(92.22 24.7 80.3)
- CMYK
- cmyk(0% 10% 27% 0%)
Teintes · Ombres · Tons
Teintes
- FEE8C1
- FEEAC8
- FEEDCF
- FFF0D6
- FFF2DD
- FFF5E4
- FFF7EB
- FFFAF1
- FFFCF8
Ombres
- DDC7A1
- BDAA89
- 9E8E72
- 80725C
- 635846
- 473F32
- 2D281E
- 16120D
- 030302
Tons
- F1DAB4
- E4D0AE
- D7C6A9
- CABBA3
- BDB19D
- B1A797
- A49D92
- 98938C
- 8C8A86
Harmonies de couleurs
Complémentaire +180°
- FEE5BA
Butter Creme
- DCE9FF
≈ Cloudless
Analogue -30° +30°
- FEE5BA
Butter Creme
- FFE2D1
≈ Powdered Peach
- E9EDBE
≈ Spring Blossom
Triadique +120° +240°
- FEE5BA
Butter Creme
- B8F6FA
≈ Pale Sky
- FADDFF
≈ Sugarpills
Complémentaire divisée +150° +210°
- FEE5BA
Butter Creme
- CEEEFF
≈ Blue Hijab
- E8E5FF
≈ Lavender Mist
Tétradique +90° +180° +270°
- FEE5BA
Butter Creme
- BFF7E3
≈ Shallow End
- DCE9FF
≈ Cloudless
- FFDEEC
≈ Transparent Pink
Contraste et accessibilité
Ag
FailSur blanc
WCAG 1.22:1 · APCA Lc 11
Ag
AAASur noir
WCAG 17.13:1 · APCA Lc 93
Meilleure couleur de texte: #000000
WCAG 17.13:1 (AAA) · APCA Lc 93
Contrast pairs
Extraits de code
CSS
:root {
--butter-creme: #fee5ba;
--butter-creme-rgb: 254 229 186;
--butter-creme-oklch: oklch(0.932 0.062 81.2);
}
.element {
color: var(--butter-creme);
background-color: hsl(38 97% 86%);
border-color: oklch(0.932 0.062 81.2);
}Tailwind CSS v4
@theme {
--color-butter-creme: #fee5ba;
--color-butter-creme-50: #fef4e2;
--color-butter-creme-100: #f2e7d1;
--color-butter-creme-200: #e1d2b7;
--color-butter-creme-300: #c7b594;
--color-butter-creme-400: #b19b75;
--color-butter-creme-500: #9b8256;
--color-butter-creme-600: #836e49;
--color-butter-creme-700: #69583a;
--color-butter-creme-800: #4e4029;
--color-butter-creme-900: #362c1c;
--color-butter-creme-950: #21190c;
}SCSS
$butter-creme: #fee5ba;
$butter-creme-rgb: 254, 229, 186;
$butter-creme-light: mix(#fff, $butter-creme, 20%);
$butter-creme-dark: mix(#000, $butter-creme, 20%);
.element {
color: $butter-creme;
box-shadow: 0 0 0 2px rgba($butter-creme, 0.35);
}