Adlandırılmış renk · #BEA582
Eggshell Pongee
Eggshell Pongee, #BEA582: rgb(190 165 130), hsl(35 32% 63%), oklch(0.735 0.056 76). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Orange mean? → · Eggshell Pongee color name →
#BEA582
oklch(0.735 0.056 76)
Renk dönüşümleri
- HEX
- #bea582
- RGB
- rgb(190 165 130)
- HSL
- hsl(35 32% 63%)
- HWB
- hwb(35 51% 25%)
- OKLCH
- oklch(0.735 0.056 76)
- OKLab
- oklab(0.735 0.014 0.054)
- CIE Lab
- lab(69.32 5.59 21.75)
- LCH
- lch(69.32 22.46 75.6)
- CMYK
- cmyk(0% 13% 32% 25%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- C4AE8E
- CBB79A
- D1BFA7
- D8C8B3
- DED1C0
- E5DACC
- EBE3D9
- F2EDE5
- F8F6F2
Koyu tonlar
- A58F70
- 8C795F
- 75654E
- 5E513E
- 483D2F
- 332B20
- 1F1A12
- 0D0A06
- 020101
Gri tonlar
- B8A182
- B19E82
- AB9A82
- A59682
- 9F9282
- 988F82
- 928B81
- 8C8781
- 868480
Renk uyumları
Tamamlayıcı +180°
- BEA582
Eggshell Pongee
- 92ABCD
≈ Hopeful Dream
Analog -30° +30°
- BEA582
Eggshell Pongee
- C89F8C
≈ Artefact
- ADAC83
≈ New Bamboo
Üçlü +120° +240°
- BEA582
Eggshell Pongee
- 7FB5B5
≈ Kingfisher Turquoise
- B79FC2
≈ Berry Frappé
Bölünmüş tamamlayıcı +150° +210°
- BEA582
Eggshell Pongee
- 84B1C5
≈ Resolute Blue
- A6A5CC
≈ Blossom Mauve
Dörtlü +90° +180° +270°
- BEA582
Eggshell Pongee
- 88B5A1
≈ Source Green
- 92ABCD
≈ Hopeful Dream
- C49CB1
≈ Lady’s Cushions Pink
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 2.36:1 · APCA Lc 47
Ag
AAASiyah üzerinde
WCAG 8.89:1 · APCA Lc 56
En iyi metin rengi: #000000
WCAG 8.89:1 (AAA) · APCA Lc 56
Contrast pairs
Kod parçacıkları
CSS
:root {
--eggshell-pongee: #bea582;
--eggshell-pongee-rgb: 190 165 130;
--eggshell-pongee-oklch: oklch(0.735 0.056 76);
}
.element {
color: var(--eggshell-pongee);
background-color: hsl(35 32% 63%);
border-color: oklch(0.735 0.056 76);
}Tailwind CSS v4
@theme {
--color-eggshell-pongee: #bea582;
--color-eggshell-pongee-50: #fef4e4;
--color-eggshell-pongee-100: #f2e6d4;
--color-eggshell-pongee-200: #e2d2ba;
--color-eggshell-pongee-300: #c8b498;
--color-eggshell-pongee-400: #b29a7a;
--color-eggshell-pongee-500: #9c815c;
--color-eggshell-pongee-600: #846e4e;
--color-eggshell-pongee-700: #6a583e;
--color-eggshell-pongee-800: #4e402c;
--color-eggshell-pongee-900: #362c1e;
--color-eggshell-pongee-950: #21190e;
}SCSS
$eggshell-pongee: #bea582;
$eggshell-pongee-rgb: 190, 165, 130;
$eggshell-pongee-light: mix(#fff, $eggshell-pongee, 20%);
$eggshell-pongee-dark: mix(#000, $eggshell-pongee, 20%);
.element {
color: $eggshell-pongee;
box-shadow: 0 0 0 2px rgba($eggshell-pongee, 0.35);
}