Nearest named color · #176A9A
#176A9A
Nearest named color: Wavy Navy
#176A9A (rgb(23 106 154), hsl(202 74% 35%), oklch(0.501 0.107 240.5)) is closest to the named color Wavy Navy. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#176A9A
oklch(0.501 0.107 240.5)
Color conversions
- HEX
- #176a9a
- RGB
- rgb(23 106 154)
- HSL
- hsl(202 74% 35%)
- HWB
- hwb(202 9% 40%)
- OKLCH
- oklch(0.501 0.107 240.5)
- OKLab
- oklab(0.501 -0.053 -0.093)
- CIE Lab
- lab(41.97 -10.75 -33.45)
- LCH
- lch(41.97 35.14 252.2)
- CMYK
- cmyk(85% 31% 0% 40%)
Tints · Shades · Tones
Tints
- 3678A4
- 4E87AF
- 6596B9
- 7AA4C3
- 90B3CD
- A6C2D7
- BCD1E1
- D2E0EB
- E8F0F5
Shades
- 125B85
- 0E4D71
- 0A3F5E
- 06314B
- 042439
- 021827
- 010D17
- 000409
- 000001
Tones
- 296D98
- 366F96
- 417293
- 4C7491
- 55768E
- 5E788C
- 677A89
- 6F7C86
- 787E83
Color harmonies
Complementary +180°
- 176A9A
Wavy Navy
- 8F5316
≈ Plain Old Brown
Analogous -30° +30°
- 176A9A
Wavy Navy
- 00707F
≈ Caribbean Dream
- 4D5FA0
≈ Bio Blue
Triadic +120° +240°
- 176A9A
Wavy Navy
- 934760
≈ Glitterati
- 5B6C1A
≈ Bowser Shell
Split-complementary +150° +210°
- 176A9A
Wavy Navy
- 97493D
≈ Smokin Hot
- 7A6000
≈ Ground Earth
Tetradic +90° +180° +270°
- 176A9A
Wavy Navy
- 854B80
≈ Vibrant Orchid
- 8F5316
≈ Plain Old Brown
- 2D7442
≈ Felt
Contrast & accessibility
Ag
AAOn white
WCAG 5.89:1 · APCA Lc 79
Ag
FailOn black
WCAG 3.56:1 · APCA Lc 23
Best text color: #FFFFFF
WCAG 5.89:1 (AA) · APCA Lc 79
Contrast pairs
Code snippets
CSS
:root {
--wavy-navy: #176a9a;
--wavy-navy-rgb: 23 106 154;
--wavy-navy-oklch: oklch(0.501 0.107 240.5);
}
.element {
color: var(--wavy-navy);
background-color: hsl(202 74% 35%);
border-color: oklch(0.501 0.107 240.5);
}Tailwind CSS v4
@theme {
--color-wavy-navy: #176a9a;
--color-wavy-navy-50: #dcfaff;
--color-wavy-navy-100: #caedff;
--color-wavy-navy-200: #addaff;
--color-wavy-navy-300: #86beea;
--color-wavy-navy-400: #60a7d7;
--color-wavy-navy-500: #378ec6;
--color-wavy-navy-600: #3078a7;
--color-wavy-navy-700: #266086;
--color-wavy-navy-800: #184763;
--color-wavy-navy-900: #0f3145;
--color-wavy-navy-950: #021d2d;
}SCSS
$wavy-navy: #176a9a;
$wavy-navy-rgb: 23, 106, 154;
$wavy-navy-light: mix(#fff, $wavy-navy, 20%);
$wavy-navy-dark: mix(#000, $wavy-navy, 20%);
.element {
color: $wavy-navy;
box-shadow: 0 0 0 2px rgba($wavy-navy, 0.35);
}