Named color · #414D62
Luna Pier
Luna Pier is #414D62: rgb(65 77 98), hsl(218 20% 32%), oklch(0.418 0.038 261.5). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Blue mean? → · Luna Pier color name →
#414D62
oklch(0.418 0.038 261.5)
Color conversions
- HEX
- #414d62
- RGB
- rgb(65 77 98)
- HSL
- hsl(218 20% 32%)
- HWB
- hwb(218 25% 62%)
- OKLCH
- oklch(0.418 0.038 261.5)
- OKLab
- oklab(0.418 -0.006 -0.038)
- CIE Lab
- lab(32.34 -0.67 -14.01)
- LCH
- lch(32.34 14.02 267.2)
- CMYK
- cmyk(34% 21% 0% 62%)
Tints · Shades · Tones
Tints
- 525D71
- 636E7F
- 757F8F
- 88909E
- 9BA2AE
- AEB4BD
- C2C6CE
- D6D9DE
- EAECEE
Shades
- 374254
- 2E3747
- 252C3A
- 1C222D
- 131821
- 0B0F16
- 05070B
- 010203
- 000000
Tones
- 475265
- 4D5768
- 535C6B
- 59616E
- 606671
- 666B74
- 6C7077
- 73767A
- 797B7D
Color harmonies
Complementary +180°
- 414D62
Luna Pier
- 574B34
≈ Hóng Zōng Brown
Analogous -30° +30°
- 414D62
Luna Pier
- 37515E
≈ Restless Sea
- 4D4960
≈ Violet Shadow
Triadic +120° +240°
- 414D62
Luna Pier
- 604443
≈ Fruit Yard
- 41523F
≈ Pine Forest
Split-complementary +150° +210°
- 414D62
Luna Pier
- 5E4739
≈ Carafe
- 4D4F36
≈ Jungle King
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
AAAOn white
WCAG 8.52:1 · APCA Lc 89
Ag
FailOn black
WCAG 2.46:1 · APCA Lc 13
Best text color: #FFFFFF
WCAG 8.52:1 (AAA) · APCA Lc 89
Contrast pairs
Code snippets
CSS
:root {
--luna-pier: #414d62;
--luna-pier-rgb: 65 77 98;
--luna-pier-oklch: oklch(0.418 0.038 261.5);
}
.element {
color: var(--luna-pier);
background-color: hsl(218 20% 32%);
border-color: oklch(0.418 0.038 261.5);
}Tailwind CSS v4
@theme {
--color-luna-pier: #414d62;
--color-luna-pier-50: #eff5ff;
--color-luna-pier-100: #e1e8f5;
--color-luna-pier-200: #ccd5e5;
--color-luna-pier-300: #adb8cc;
--color-luna-pier-400: #929fb6;
--color-luna-pier-500: #7887a0;
--color-luna-pier-600: #667287;
--color-luna-pier-700: #515b6d;
--color-luna-pier-800: #3b4350;
--color-luna-pier-900: #282e38;
--color-luna-pier-950: #161b22;
}SCSS
$luna-pier: #414d62;
$luna-pier-rgb: 65, 77, 98;
$luna-pier-light: mix(#fff, $luna-pier, 20%);
$luna-pier-dark: mix(#000, $luna-pier, 20%);
.element {
color: $luna-pier;
box-shadow: 0 0 0 2px rgba($luna-pier, 0.35);
}