Nearest named color · #486DA3
#486DA3
Nearest named color: Song of the Sea
#486DA3 (rgb(72 109 163), hsl(216 39% 46%), oklch(0.532 0.095 257.8)) is closest to the named color Song of the Sea. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#486DA3
oklch(0.532 0.095 257.8)
Color conversions
- HEX
- #486da3
- RGB
- rgb(72 109 163)
- HSL
- hsl(216 39% 46%)
- HWB
- hwb(216 28% 36%)
- OKLCH
- oklch(0.532 0.095 257.8)
- OKLab
- oklab(0.532 -0.02 -0.093)
- CIE Lab
- lab(45.12 -0.92 -33.68)
- LCH
- lch(45.12 33.69 268.4)
- CMYK
- cmyk(56% 33% 0% 36%)
Tints · Shades · Tones
Tints
- 597BAC
- 6B89B6
- 7C98BF
- 8EA6C9
- A0B4D2
- B3C3DB
- C5D2E4
- D8E1ED
- ECF0F6
Shades
- 3D5E8D
- 334F78
- 294163
- 1F334F
- 16263C
- 0D192A
- 060D19
- 02040A
- 000101
Tones
- 4E6FA0
- 54719D
- 5A7399
- 5F7596
- 657793
- 6A798F
- 707B8B
- 757D88
- 7B7E84
Color harmonies
Complementary +180°
- 486DA3
Song of the Sea
- 8B6421
≈ Kumera
Analogous -30° +30°
- 486DA3
Song of the Sea
- 1A7697
≈ Bateau
- 6963A0
≈ Scampi
Triadic +120° +240°
- 486DA3
Song of the Sea
- 9C5457
≈ Brown Cerberus
- 507941
≈ Mana Tree
Split-complementary +150° +210°
- 486DA3
Song of the Sea
- 995A39
≈ Chestnut Stallion
- 727025
≈ Olivetone
Tetradic +90° +180° +270°
- 486DA3
Song of the Sea
- 945476
≈ Sea Fan Fuchsia
- 8B6421
≈ Kumera
- 237E61
≈ Verdant Green
Contrast & accessibility
Ag
AAOn white
WCAG 5.26:1 · APCA Lc 76
Ag
FailOn black
WCAG 3.99:1 · APCA Lc 26
Best text color: #FFFFFF
WCAG 5.26:1 (AA) · APCA Lc 76
Contrast pairs
Code snippets
CSS
:root {
--song-of-the-sea: #486da3;
--song-of-the-sea-rgb: 72 109 163;
--song-of-the-sea-oklch: oklch(0.532 0.095 257.8);
}
.element {
color: var(--song-of-the-sea);
background-color: hsl(216 39% 46%);
border-color: oklch(0.532 0.095 257.8);
}Tailwind CSS v4
@theme {
--color-song-of-the-sea: #486da3;
--color-song-of-the-sea-50: #e5f6ff;
--color-song-of-the-sea-100: #d6e9ff;
--color-song-of-the-sea-200: #bdd6fe;
--color-song-of-the-sea-300: #9bb9e9;
--color-song-of-the-sea-400: #7ba0d7;
--color-song-of-the-sea-500: #5d87c5;
--color-song-of-the-sea-600: #4f73a6;
--color-song-of-the-sea-700: #3f5c85;
--color-song-of-the-sea-800: #2b4363;
--color-song-of-the-sea-900: #1d2f45;
--color-song-of-the-sea-950: #0d1b2d;
}SCSS
$song-of-the-sea: #486da3;
$song-of-the-sea-rgb: 72, 109, 163;
$song-of-the-sea-light: mix(#fff, $song-of-the-sea, 20%);
$song-of-the-sea-dark: mix(#000, $song-of-the-sea, 20%);
.element {
color: $song-of-the-sea;
box-shadow: 0 0 0 2px rgba($song-of-the-sea, 0.35);
}