Nazwany kolor · #59676B
Whale Grey
Whale Grey to #59676B: rgb(89 103 107), hsl(193 9% 38%), oklch(0.503 0.018 216.8). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Whale Grey color name →
#59676B
oklch(0.503 0.018 216.8)
Konwersje koloru
- HEX
- #59676b
- RGB
- rgb(89 103 107)
- HSL
- hsl(193 9% 38%)
- HWB
- hwb(193 35% 58%)
- OKLCH
- oklch(0.503 0.018 216.8)
- OKLab
- oklab(0.503 -0.015 -0.011)
- CIE Lab
- lab(42.52 -4.81 -4.15)
- LCH
- lch(42.52 6.36 220.8)
- CMYK
- cmyk(17% 4% 0% 58%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 687579
- 788387
- 889295
- 98A1A3
- A8B0B2
- B9BFC1
- CACFD0
- DCDFE0
- EDEFEF
Odcienie ciemniejsze
- 4C595C
- 404B4E
- 343D3F
- 283032
- 1D2325
- 131718
- 090C0D
- 030404
- 000000
Tony
- 5D696D
- 616C6F
- 656E71
- 687173
- 6C7375
- 707678
- 74787A
- 787B7C
- 7C7D7E
Harmonie kolorów
Komplementarna +180°
- 59676B
Whale Grey
- 6E615D
≈ Browse Brown
Analogowa -30° +30°
- 59676B
Whale Grey
- 596866
≈ Brooklyn
- 5C656E
≈ Slate Grey
Triada +120° +240°
- 59676B
Whale Grey
- 6B6068
≈ Vibrant Vision
- 676459
≈ Cast Iron
Komplementarna rozszczepiona +150° +210°
- 59676B
Whale Grey
- 6E6062
≈ Duomo
- 6C6259
≈ Back Stage
Tetrada +90° +180° +270°
- 59676B
Whale Grey
- 67626D
≈ Muted Mulberry
- 6E615D
≈ Browse Brown
- 61665B
≈ Woohringa
Kontrast i dostępność
Ag
AANa bieli
WCAG 5.87:1 · APCA Lc 79
Ag
FailNa czerni
WCAG 3.57:1 · APCA Lc 22
Najlepszy kolor tekstu: #FFFFFF
WCAG 5.87:1 (AA) · APCA Lc 79
Contrast pairs
Fragmenty kodu
CSS
:root {
--whale-grey: #59676b;
--whale-grey-rgb: 89 103 107;
--whale-grey-oklch: oklch(0.503 0.018 216.8);
}
.element {
color: var(--whale-grey);
background-color: hsl(193 9% 38%);
border-color: oklch(0.503 0.018 216.8);
}Tailwind CSS v4
@theme {
--color-whale-grey: #59676b;
--color-whale-grey-50: #f0f6f9;
--color-whale-grey-100: #e2e9ec;
--color-whale-grey-200: #ccd6d9;
--color-whale-grey-300: #aebabe;
--color-whale-grey-400: #93a1a5;
--color-whale-grey-500: #79898e;
--color-whale-grey-600: #677478;
--color-whale-grey-700: #525d60;
--color-whale-grey-800: #3c4446;
--color-whale-grey-900: #292f31;
--color-whale-grey-950: #171c1d;
}SCSS
$whale-grey: #59676b;
$whale-grey-rgb: 89, 103, 107;
$whale-grey-light: mix(#fff, $whale-grey, 20%);
$whale-grey-dark: mix(#000, $whale-grey, 20%);
.element {
color: $whale-grey;
box-shadow: 0 0 0 2px rgba($whale-grey, 0.35);
}