Adlandırılmış renk · #674848
Chocolate Eclair
Chocolate Eclair, #674848: rgb(103 72 72), hsl(0 18% 34%), oklch(0.436 0.043 18.9). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Brown mean? → · Chocolate Eclair color name →
#674848
oklch(0.436 0.043 18.9)
Renk dönüşümleri
- HEX
- #674848
- RGB
- rgb(103 72 72)
- HSL
- hsl(0 18% 34%)
- HWB
- hwb(0 28% 60%)
- OKLCH
- oklch(0.436 0.043 18.9)
- OKLab
- oklab(0.436 0.04 0.014)
- CIE Lab
- lab(34.1 13.66 5.55)
- LCH
- lch(34.1 14.74 22.1)
- CMYK
- cmyk(0% 30% 30% 60%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 755958
- 846A69
- 937B7B
- A28D8C
- B19F9F
- C0B1B1
- D0C4C4
- DFD8D7
- EFEBEB
Koyu tonlar
- 593D3D
- 4B3333
- 3D2929
- 301F1F
- 231616
- 170D0D
- 0C0606
- 040202
- 000000
Gri tonlar
- 6A4D4D
- 6C5353
- 6F5958
- 725E5E
- 746463
- 776969
- 796F6F
- 7B7574
- 7E7A7A
Renk uyumları
Tamamlayıcı +180°
- 674848
Chocolate Eclair
- 33595A
≈ Depth Charge
Analog -30° +30°
- 674848
Chocolate Eclair
- 644855
≈ Plum Harvest
- 654B3D
≈ Earth Chicory
Üçlü +120° +240°
- 674848
Chocolate Eclair
- 455741
≈ Catachan Green
- 435269
≈ Into the Stratosphere
Bölünmüş tamamlayıcı +150° +210°
- 674848
Chocolate Eclair
- 39594D
≈ Plantation
- 385664
≈ Kingfisher
Dörtlü +90° +180° +270°
- 674848
Chocolate Eclair
- 535338
≈ Avocado Pear
- 33595A
≈ Depth Charge
- 504E68
≈ Pango Black
Kontrast ve erişilebilirlik
Ag
AAABeyaz üzerinde
WCAG 8.08:1 · APCA Lc 88
Ag
FailSiyah üzerinde
WCAG 2.59:1 · APCA Lc 14
En iyi metin rengi: #FFFFFF
WCAG 8.08:1 (AAA) · APCA Lc 88
Contrast pairs
Kod parçacıkları
CSS
:root {
--chocolate-eclair: #674848;
--chocolate-eclair-rgb: 103 72 72;
--chocolate-eclair-oklch: oklch(0.436 0.043 18.9);
}
.element {
color: var(--chocolate-eclair);
background-color: hsl(0 18% 34%);
border-color: oklch(0.436 0.043 18.9);
}Tailwind CSS v4
@theme {
--color-chocolate-eclair: #674848;
--color-chocolate-eclair-50: #fff1f0;
--color-chocolate-eclair-100: #f6e3e2;
--color-chocolate-eclair-200: #e6cecc;
--color-chocolate-eclair-300: #cdafae;
--color-chocolate-eclair-400: #b79594;
--color-chocolate-eclair-500: #a17b7b;
--color-chocolate-eclair-600: #886868;
--color-chocolate-eclair-700: #6d5353;
--color-chocolate-eclair-800: #503d3d;
--color-chocolate-eclair-900: #382a2a;
--color-chocolate-eclair-950: #221718;
}SCSS
$chocolate-eclair: #674848;
$chocolate-eclair-rgb: 103, 72, 72;
$chocolate-eclair-light: mix(#fff, $chocolate-eclair, 20%);
$chocolate-eclair-dark: mix(#000, $chocolate-eclair, 20%);
.element {
color: $chocolate-eclair;
box-shadow: 0 0 0 2px rgba($chocolate-eclair, 0.35);
}