Nazwany kolor · #627377
Relaxed Navy
Relaxed Navy to #627377: rgb(98 115 119), hsl(191 10% 43%), oklch(0.543 0.021 213.5). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Relaxed Navy color name →
#627377
oklch(0.543 0.021 213.5)
Konwersje koloru
- HEX
- #627377
- RGB
- rgb(98 115 119)
- HSL
- hsl(191 10% 43%)
- HWB
- hwb(191 38% 53%)
- OKLCH
- oklch(0.543 0.021 213.5)
- OKLab
- oklab(0.543 -0.018 -0.012)
- CIE Lab
- lab(47.14 -5.85 -4.46)
- LCH
- lch(47.14 7.36 217.3)
- CMYK
- cmyk(18% 3% 0% 53%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 718084
- 7F8D91
- 8E9B9E
- 9EA9AB
- ADB7B9
- BDC5C6
- CDD3D4
- DEE1E2
- EEF0F1
Odcienie ciemniejsze
- 546367
- 475457
- 3A4547
- 2D3638
- 21282A
- 161B1C
- 0B0F10
- 030505
- 000101
Tony
- 657478
- 687679
- 6B777A
- 6E787B
- 717A7C
- 747B7C
- 777C7D
- 7A7D7E
- 7D7F7F
Harmonie kolorów
Komplementarna +180°
- 627377
Relaxed Navy
- 7B6B68
≈ Muscatel
Analogowa -30° +30°
- 627377
Relaxed Navy
- 627471
≈ Drifting Downstream
- 65717B
≈ Stormy Weather
Triada +120° +240°
- 627377
Relaxed Navy
- 786B75
≈ Lavender Elegance
- 747062
≈ Randall
Komplementarna rozszczepiona +150° +210°
- 627377
Relaxed Navy
- 7B6B6E
≈ Gothic Spire
- 796D63
≈ Trailhead
Tetrada +90° +180° +270°
- 627377
Relaxed Navy
- 726D7A
≈ Paisley
- 7B6B68
≈ Muscatel
- 6D7264
≈ Moss Beach
Kontrast i dostępność
Ag
AANa bieli
WCAG 4.95:1 · APCA Lc 74
Ag
FailNa czerni
WCAG 4.23:1 · APCA Lc 27
Najlepszy kolor tekstu: #FFFFFF
WCAG 4.95:1 (AA) · APCA Lc 74
Contrast pairs
Fragmenty kodu
CSS
:root {
--relaxed-navy: #627377;
--relaxed-navy-rgb: 98 115 119;
--relaxed-navy-oklch: oklch(0.543 0.021 213.5);
}
.element {
color: var(--relaxed-navy);
background-color: hsl(191 10% 43%);
border-color: oklch(0.543 0.021 213.5);
}Tailwind CSS v4
@theme {
--color-relaxed-navy: #627377;
--color-relaxed-navy-50: #eff7f9;
--color-relaxed-navy-100: #e0eaec;
--color-relaxed-navy-200: #cbd7da;
--color-relaxed-navy-300: #acbabe;
--color-relaxed-navy-400: #91a2a6;
--color-relaxed-navy-500: #778a8f;
--color-relaxed-navy-600: #657579;
--color-relaxed-navy-700: #505d61;
--color-relaxed-navy-800: #3a4447;
--color-relaxed-navy-900: #282f31;
--color-relaxed-navy-950: #161c1d;
}SCSS
$relaxed-navy: #627377;
$relaxed-navy-rgb: 98, 115, 119;
$relaxed-navy-light: mix(#fff, $relaxed-navy, 20%);
$relaxed-navy-dark: mix(#000, $relaxed-navy, 20%);
.element {
color: $relaxed-navy;
box-shadow: 0 0 0 2px rgba($relaxed-navy, 0.35);
}