Nearest named color · #2480AD
#2480AD
Nearest named color: Neptune
#2480AD (rgb(36 128 173), hsl(200 66% 41%), oklch(0.568 0.108 235.1)) is closest to the named color Neptune. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#2480AD
oklch(0.568 0.108 235.1)
Color conversions
- HEX
- #2480ad
- RGB
- rgb(36 128 173)
- HSL
- hsl(200 66% 41%)
- HWB
- hwb(200 14% 32%)
- OKLCH
- oklch(0.568 0.108 235.1)
- OKLab
- oklab(0.568 -0.062 -0.088)
- CIE Lab
- lab(49.98 -15.11 -32.04)
- LCH
- lch(49.98 35.42 244.7)
- CMYK
- cmyk(79% 26% 0% 32%)
Tints · Shades · Tones
Tints
- 418DB5
- 5899BE
- 6EA6C6
- 83B2CF
- 98BFD7
- ACCCDF
- C1D8E7
- D5E5EF
- EAF2F7
Shades
- 1E6E96
- 185D7F
- 124D6A
- 0C3D55
- 072E41
- 041F2D
- 02121B
- 00060B
- 000101
Tones
- 3480A9
- 4081A4
- 4A81A0
- 53819C
- 5C8197
- 648193
- 6B818E
- 72818A
- 798085
Color harmonies
Complementary +180°
- 2480AD
Neptune
- A76432
≈ Mai Tai
Analogous -30° +30°
- 2480AD
Neptune
- 008792
≈ Blue Slushie
- 5875B6
≈ Diva Violet
Triadic +120° +240°
- 2480AD
Neptune
- A85A7A
≈ Indian Pink
- 757E2A
≈ Ripe Green
Split-complementary +150° +210°
- 2480AD
Neptune
- AD5C56
≈ Pottery Red
- 947119
≈ Bistre Brown
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
FailOn white
WCAG 4.40:1 · APCA Lc 70
Ag
AAOn black
WCAG 4.76:1 · APCA Lc 31
Best text color: #000000
WCAG 4.76:1 (AA) · APCA Lc 31
Contrast pairs
Code snippets
CSS
:root {
--neptune: #2480ad;
--neptune-rgb: 36 128 173;
--neptune-oklch: oklch(0.568 0.108 235.1);
}
.element {
color: var(--neptune);
background-color: hsl(200 66% 41%);
border-color: oklch(0.568 0.108 235.1);
}Tailwind CSS v4
@theme {
--color-neptune: #2480ad;
--color-neptune-50: #d9fbff;
--color-neptune-100: #c7eeff;
--color-neptune-200: #a9dcfd;
--color-neptune-300: #81c0e8;
--color-neptune-400: #58a8d5;
--color-neptune-500: #2890c3;
--color-neptune-600: #257aa5;
--color-neptune-700: #1e6284;
--color-neptune-800: #104861;
--color-neptune-900: #0b3244;
--color-neptune-950: #001e2c;
}SCSS
$neptune: #2480ad;
$neptune-rgb: 36, 128, 173;
$neptune-light: mix(#fff, $neptune, 20%);
$neptune-dark: mix(#000, $neptune, 20%);
.element {
color: $neptune;
box-shadow: 0 0 0 2px rgba($neptune, 0.35);
}