Adlandırılmış renk · #FEE5BA
Butter Creme
Butter Creme, #FEE5BA: rgb(254 229 186), hsl(38 97% 86%), oklch(0.932 0.062 81.2). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Orange mean? → · Butter Creme color name →
#FEE5BA
oklch(0.932 0.062 81.2)
Renk dönüşümleri
- 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%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- FEE8C1
- FEEAC8
- FEEDCF
- FFF0D6
- FFF2DD
- FFF5E4
- FFF7EB
- FFFAF1
- FFFCF8
Koyu tonlar
- DDC7A1
- BDAA89
- 9E8E72
- 80725C
- 635846
- 473F32
- 2D281E
- 16120D
- 030302
Gri tonlar
- F1DAB4
- E4D0AE
- D7C6A9
- CABBA3
- BDB19D
- B1A797
- A49D92
- 98938C
- 8C8A86
Renk uyumları
Tamamlayıcı +180°
- FEE5BA
Butter Creme
- DCE9FF
≈ Cloudless
Analog -30° +30°
- FEE5BA
Butter Creme
- FFE2D1
≈ Powdered Peach
- E9EDBE
≈ Spring Blossom
Üçlü +120° +240°
- FEE5BA
Butter Creme
- B8F6FA
≈ Pale Sky
- FADDFF
≈ Sugarpills
Bölünmüş tamamlayıcı +150° +210°
- FEE5BA
Butter Creme
- CEEEFF
≈ Blue Hijab
- E8E5FF
≈ Lavender Mist
Dörtlü +90° +180° +270°
- FEE5BA
Butter Creme
- BFF7E3
≈ Shallow End
- DCE9FF
≈ Cloudless
- FFDEEC
≈ Transparent Pink
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.22:1 · APCA Lc 11
Ag
AAASiyah üzerinde
WCAG 17.13:1 · APCA Lc 93
En iyi metin rengi: #000000
WCAG 17.13:1 (AAA) · APCA Lc 93
Contrast pairs
Kod parçacıkları
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);
}