Named color · #5A88C8
Marina
Marina is #5A88C8: rgb(90 136 200), hsl(215 50% 57%), oklch(0.622 0.11 256.8). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Blue mean? → · Marina color name →
#5A88C8
oklch(0.622 0.11 256.8)
Color conversions
- HEX
- #5a88c8
- RGB
- rgb(90 136 200)
- HSL
- hsl(215 50% 57%)
- HWB
- hwb(215 35% 22%)
- OKLCH
- oklch(0.622 0.11 256.8)
- OKLab
- oklab(0.622 -0.025 -0.107)
- CIE Lab
- lab(55.51 -1.76 -38.62)
- LCH
- lch(55.51 38.66 267.4)
- CMYK
- cmyk(55% 32% 0% 22%)
Tints · Shades · Tones
Tints
- 6A94CE
- 7AA0D4
- 8AABDA
- 9BB7DF
- ABC3E5
- BBCFEA
- CCDBF0
- DDE7F5
- EEF3FA
Shades
- 4D75AE
- 416394
- 35527B
- 294163
- 1E314C
- 132236
- 091321
- 03060F
- 000102
Tones
- 5E88C1
- 6387BA
- 6786B3
- 6B86AC
- 6E85A5
- 72849D
- 768396
- 79828F
- 7D8187
Color harmonies
Complementary +180°
- 5A88C8
Marina
- AC7D2E
≈ Release the Hounds
Analogous -30° +30°
- 5A88C8
Marina
- 2593BA
≈ Spa Dream
- 827CC5
≈ Ube
Triadic +120° +240°
- 5A88C8
Marina
- C0696F
≈ Watermelon Gelato
- 669652
≈ Wicked Witch
Split-complementary +150° +210°
- 5A88C8
Marina
- BC704A
≈ Pottery Clay
- 8F8B32
≈ Uguisu Green
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
FailOn white
WCAG 3.62:1 · APCA Lc 64
Ag
AAOn black
WCAG 5.79:1 · APCA Lc 38
Best text color: #000000
WCAG 5.79:1 (AA) · APCA Lc 38
Contrast pairs
Code snippets
CSS
:root {
--marina: #5a88c8;
--marina-rgb: 90 136 200;
--marina-oklch: oklch(0.622 0.11 256.8);
}
.element {
color: var(--marina);
background-color: hsl(215 50% 57%);
border-color: oklch(0.622 0.11 256.8);
}Tailwind CSS v4
@theme {
--color-marina: #5a88c8;
--color-marina-50: #e3f7ff;
--color-marina-100: #d2eaff;
--color-marina-200: #b8d6ff;
--color-marina-300: #95b9f0;
--color-marina-400: #74a0df;
--color-marina-500: #5487ce;
--color-marina-600: #4873ae;
--color-marina-700: #395c8b;
--color-marina-800: #274368;
--color-marina-900: #1a2f49;
--color-marina-950: #0a1b30;
}SCSS
$marina: #5a88c8;
$marina-rgb: 90, 136, 200;
$marina-light: mix(#fff, $marina, 20%);
$marina-dark: mix(#000, $marina, 20%);
.element {
color: $marina;
box-shadow: 0 0 0 2px rgba($marina, 0.35);
}