이름 색상 · #377B70

Pearl Green

Pearl Green은(는) #377B70: rgb(55 123 112), hsl(170 38% 35%), oklch(0.536 0.071 181.4). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.

What does Teal mean? → · Pearl Green color name →

#377B70

oklch(0.536 0.071 181.4)

색상 변환

HEX: #377b70
RGB: rgb(55 123 112)
HSL: hsl(170 38% 35%)
HWB: hwb(170 22% 52%)
OKLCH: oklch(0.536 0.071 181.4)
OKLab: oklab(0.536 -0.071 -0.002)
CIE Lab: lab(47.02 -24.71 -0.87)
LCH: lch(47.02 24.72 182)
CMYK: cmyk(55% 0% 9% 52%)

틴트 · 셰이드 · 톤

틴트

4D887D
61948B
75A199
88AEA7
9CBBB5
AFC9C3
C3D6D2
D7E4E1
EBF1F0

셰이드

2E6A60
265A51
1E4A43
163A35
0F2C27
081E1A
03100E
010504
000101

톤

417C72
497C73
517D75
597D76
607E78
677E7A
6D7F7B
747F7D
7A807E

색 조화

보색 +180°

377B70
Pearl Green
905C6A
≈ Cabernet

유사색 -30° +30°

삼각 배색 +120° +240°

분열 보색 +150° +210°

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

대비 및 접근성

흰색 위

WCAG 4.96:1 · APCA Lc 74

검은색 위

WCAG 4.22:1 · APCA Lc 28

Fail

가장 좋은 글자색: #FFFFFF

WCAG 4.96:1 (AA) · APCA Lc 74

Contrast pairs

코드 스니펫

CSS

:root {
  --pearl-green: #377b70;
  --pearl-green-rgb: 55 123 112;
  --pearl-green-oklch: oklch(0.536 0.071 181.4);
}

.element {
  color: var(--pearl-green);
  background-color: hsl(170 38% 35%);
  border-color: oklch(0.536 0.071 181.4);
}

Tailwind CSS v4

@theme {
  --color-pearl-green: #377b70;
  --color-pearl-green-50: #e0fcf7;
  --color-pearl-green-100: #cff0ea;
  --color-pearl-green-200: #b3dfd7;
  --color-pearl-green-300: #8ec4bb;
  --color-pearl-green-400: #6dada1;
  --color-pearl-green-500: #4a9689;
  --color-pearl-green-600: #3f7f74;
  --color-pearl-green-700: #32655d;
  --color-pearl-green-800: #244b43;
  --color-pearl-green-900: #18342e;
  --color-pearl-green-950: #081f1b;
}

SCSS

$pearl-green: #377b70;
$pearl-green-rgb: 55, 123, 112;
$pearl-green-light: mix(#fff, $pearl-green, 20%);
$pearl-green-dark: mix(#000, $pearl-green, 20%);

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

비슷한 이름 색상

Palettes with similar colors

도구에서 열기

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