Nazwany kolor · #E8C2B4
Mellow Marrow
Mellow Marrow to #E8C2B4: rgb(232 194 180), hsl(16 53% 81%), oklch(0.843 0.048 41.2). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Pink mean? → · Mellow Marrow color name →
#E8C2B4
oklch(0.843 0.048 41.2)
Konwersje koloru
- HEX
- #e8c2b4
- RGB
- rgb(232 194 180)
- HSL
- hsl(16 53% 81%)
- HWB
- hwb(16 71% 9%)
- OKLCH
- oklch(0.843 0.048 41.2)
- OKLab
- oklab(0.843 0.036 0.031)
- CIE Lab
- lab(81.51 12.4 12.39)
- LCH
- lch(81.51 17.53 45)
- CMYK
- cmyk(0% 16% 22% 9%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- EAC8BB
- EDCEC3
- EFD4CA
- F2DAD2
- F4E0D9
- F6E6E1
- F9EDE8
- FBF3F0
- FDF9F7
Odcienie ciemniejsze
- CAA89C
- AC8F85
- 90776E
- 746058
- 594944
- 403430
- 29201D
- 130E0C
- 030202
Tony
- DDBBAF
- D3B5A9
- C8AEA4
- BDA79F
- B3A19A
- A99A95
- 9E938F
- 948D8A
- 8A8685
Harmonie kolorów
Komplementarna +180°
- E8C2B4
Mellow Marrow
- AAD3E2
≈ Light Blue Glint
Analogowa -30° +30°
- E8C2B4
Mellow Marrow
- E9BFC4
≈ Sweet Blush
- E0C7AA
≈ Persian Flatbread
Triada +120° +240°
- E8C2B4
Mellow Marrow
- B1D6C2
≈ Chlorophyll Cream
- C5C9EB
≈ Powdered Granite
Komplementarna rozszczepiona +150° +210°
- E8C2B4
Mellow Marrow
- A8D6D3
≈ Sinbad
- B5CEEA
≈ Morality
Tetrada +90° +180° +270°
- E8C2B4
Mellow Marrow
- C1D3B2
≈ Morris Leaf
- AAD3E2
≈ Light Blue Glint
- D6C3E3
≈ New Violet
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.63:1 · APCA Lc 28
Ag
AAANa czerni
WCAG 12.80:1 · APCA Lc 74
Najlepszy kolor tekstu: #000000
WCAG 12.80:1 (AAA) · APCA Lc 74
Contrast pairs
Fragmenty kodu
CSS
:root {
--mellow-marrow: #e8c2b4;
--mellow-marrow-rgb: 232 194 180;
--mellow-marrow-oklch: oklch(0.843 0.048 41.2);
}
.element {
color: var(--mellow-marrow);
background-color: hsl(16 53% 81%);
border-color: oklch(0.843 0.048 41.2);
}Tailwind CSS v4
@theme {
--color-mellow-marrow: #e8c2b4;
--color-mellow-marrow-50: #fff1ea;
--color-mellow-marrow-100: #f7e3db;
--color-mellow-marrow-200: #e7cec4;
--color-mellow-marrow-300: #ceb0a4;
--color-mellow-marrow-400: #b89689;
--color-mellow-marrow-500: #a27c6e;
--color-mellow-marrow-600: #89695d;
--color-mellow-marrow-700: #6e544a;
--color-mellow-marrow-800: #513d36;
--color-mellow-marrow-900: #392a25;
--color-mellow-marrow-950: #231714;
}SCSS
$mellow-marrow: #e8c2b4;
$mellow-marrow-rgb: 232, 194, 180;
$mellow-marrow-light: mix(#fff, $mellow-marrow, 20%);
$mellow-marrow-dark: mix(#000, $mellow-marrow, 20%);
.element {
color: $mellow-marrow;
box-shadow: 0 0 0 2px rgba($mellow-marrow, 0.35);
}