이름 색상 · #2E5D9D
Neptune Blue
Neptune Blue은(는) #2E5D9D: rgb(46 93 157), hsl(215 55% 40%), oklch(0.478 0.116 256.8). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Blue mean? → · Neptune Blue color name →
#2E5D9D
oklch(0.478 0.116 256.8)
색상 변환
- HEX
- #2e5d9d
- RGB
- rgb(46 93 157)
- HSL
- hsl(215 55% 40%)
- HWB
- hwb(215 18% 38%)
- OKLCH
- oklch(0.478 0.116 256.8)
- OKLab
- oklab(0.478 -0.026 -0.113)
- CIE Lab
- lab(38.72 0.83 -40.3)
- LCH
- lch(38.72 40.31 271.2)
- CMYK
- cmyk(71% 41% 0% 38%)
틴트 · 셰이드 · 톤
틴트
- 426DA7
- 577DB2
- 6B8CBC
- 7F9CC6
- 94ACCF
- A8BDD9
- BECDE3
- D3DEEC
- E9EEF6
셰이드
- 275088
- 1F4373
- 18375F
- 122A4C
- 0B1F3A
- 061428
- 020A18
- 010309
- 000001
톤
- 37619B
- 406598
- 486996
- 516C93
- 597090
- 61738D
- 69778A
- 707A87
- 787D84
색 조화
보색 +180°
- 2E5D9D
Neptune Blue
- 7C5400
≈ Intense Brown
유사색 -30° +30°
- 2E5D9D
Neptune Blue
- 006785
≈ Ansel
- 5A519A
≈ Coronation Blue
삼각 배색 +120° +240°
- 2E5D9D
Neptune Blue
- 933D45
≈ Banana Blossom
- 3B6B23
≈ Green-Eyed Monster
분열 보색 +150° +210°
- 2E5D9D
Neptune Blue
- 90451A
≈ Korichnewyi Brown
- 646000
≈ Green Brown
사각 배색 +90° +180° +270°
대비 및 접근성
Ag
AA흰색 위
WCAG 6.62:1 · APCA Lc 82
Ag
Fail검은색 위
WCAG 3.16:1 · APCA Lc 19
가장 좋은 글자색: #FFFFFF
WCAG 6.62:1 (AA) · APCA Lc 82
Contrast pairs
코드 스니펫
CSS
:root {
--neptune-blue: #2e5d9d;
--neptune-blue-rgb: 46 93 157;
--neptune-blue-oklch: oklch(0.478 0.116 256.8);
}
.element {
color: var(--neptune-blue);
background-color: hsl(215 55% 40%);
border-color: oklch(0.478 0.116 256.8);
}Tailwind CSS v4
@theme {
--color-neptune-blue: #2e5d9d;
--color-neptune-blue-50: #e2f7ff;
--color-neptune-blue-100: #d1eaff;
--color-neptune-blue-200: #b7d6ff;
--color-neptune-blue-300: #93b9f3;
--color-neptune-blue-400: #71a0e2;
--color-neptune-blue-500: #5187d2;
--color-neptune-blue-600: #4572b1;
--color-neptune-blue-700: #375c8e;
--color-neptune-blue-800: #25436a;
--color-neptune-blue-900: #182f4a;
--color-neptune-blue-950: #091b31;
}SCSS
$neptune-blue: #2e5d9d;
$neptune-blue-rgb: 46, 93, 157;
$neptune-blue-light: mix(#fff, $neptune-blue, 20%);
$neptune-blue-dark: mix(#000, $neptune-blue, 20%);
.element {
color: $neptune-blue;
box-shadow: 0 0 0 2px rgba($neptune-blue, 0.35);
}