이름 색상 · #546473

Midnight Show

Midnight Show은(는) #546473: rgb(84 100 115), hsl(209 16% 39%), oklch(0.495 0.031 246.7). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.

What does Gray mean? → · Midnight Show color name →

#546473

oklch(0.495 0.031 246.7)

색상 변환

HEX: #546473
RGB: rgb(84 100 115)
HSL: hsl(209 16% 39%)
HWB: hwb(209 33% 55%)
OKLCH: oklch(0.495 0.031 246.7)
OKLab: oklab(0.495 -0.012 -0.028)
CIE Lab: lab(41.45 -3.48 -10.62)
LCH: lch(41.45 11.17 251.9)
CMYK: cmyk(27% 13% 0% 55%)

틴트 · 셰이드 · 톤

틴트

647280
74818D
84909B
959FA9
A6AEB7
B7BEC5
C9CED3
DADEE2
EDEEF0

셰이드

485663
3C4854
313B45
262E36
1B2228
11161B
080B0F
020305
000001

톤

586774
5D6A76
616C77
656F78
6A727A
6E757B
73787C
777A7D
7C7D7F

색 조화

보색 +180°

546473
Midnight Show
6E5F4F
≈ Chocolate Chip

유사색 -30° +30°

삼각 배색 +120° +240°

분열 보색 +150° +210°

사각 배색 +90° +180° +270°

대비 및 접근성

흰색 위

WCAG 6.09:1 · APCA Lc 80

검은색 위

WCAG 3.44:1 · APCA Lc 21

Fail

가장 좋은 글자색: #FFFFFF

WCAG 6.09:1 (AA) · APCA Lc 80

Contrast pairs

코드 스니펫

CSS

:root {
  --midnight-show: #546473;
  --midnight-show-rgb: 84 100 115;
  --midnight-show-oklch: oklch(0.495 0.031 246.7);
}

.element {
  color: var(--midnight-show);
  background-color: hsl(209 16% 39%);
  border-color: oklch(0.495 0.031 246.7);
}

Tailwind CSS v4

@theme {
  --color-midnight-show: #546473;
  --color-midnight-show-50: #eff6fe;
  --color-midnight-show-100: #e0e9f2;
  --color-midnight-show-200: #cad6e1;
  --color-midnight-show-300: #acb9c7;
  --color-midnight-show-400: #90a1b0;
  --color-midnight-show-500: #76899a;
  --color-midnight-show-600: #647482;
  --color-midnight-show-700: #505c68;
  --color-midnight-show-800: #3a444d;
  --color-midnight-show-900: #272f35;
  --color-midnight-show-950: #161b20;
}

SCSS

$midnight-show: #546473;
$midnight-show-rgb: 84, 100, 115;
$midnight-show-light: mix(#fff, $midnight-show, 20%);
$midnight-show-dark: mix(#000, $midnight-show, 20%);

.element {
  color: $midnight-show;
  box-shadow: 0 0 0 2px rgba($midnight-show, 0.35);
}

비슷한 이름 색상

Palettes with similar colors

도구에서 열기

피커 조합 대비 검사기 Studio JSON API