이름 색상 · #6AB417

Extra Life

Extra Life은(는) #6AB417: rgb(106 180 23), hsl(88 77% 40%), oklch(0.695 0.19 133.2). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.

What does Green mean? → · Extra Life color name →

#6AB417

oklch(0.695 0.19 133.2)

색상 변환

HEX: #6ab417
RGB: rgb(106 180 23)
HSL: hsl(88 77% 40%)
HWB: hwb(88 9% 29%)
OKLCH: oklch(0.695 0.19 133.2)
OKLab: oklab(0.695 -0.13 0.138)
CIE Lab: lab(66.5 -41.17 62.44)
LCH: lch(66.5 74.79 123.4)
CMYK: cmyk(41% 0% 87% 29%)

틴트 · 셰이드 · 톤

틴트

79BC3F
88C459
97CC70
A6D386
B5DB9B
C3E2AF
D2EAC3
E1F1D7
F0F8EB

셰이드

5B9C12
4D850E
3F6E0A
315806
244404
183002
0D1D01
040C00
000200

톤

6DAF30
70AA3F
73A54B
75A055
779B5E
799666
7B906D
7D8B74
7F867A

색 조화

보색 +180°

6AB417
Extra Life
C573EF
≈ Illicit Purple

유사색 -30° +30°

삼각 배색 +120° +240°

분열 보색 +150° +210°

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

대비 및 접근성

흰색 위

WCAG 2.57:1 · APCA Lc 50

Fail

검은색 위

WCAG 8.15:1 · APCA Lc 52

AAA

가장 좋은 글자색: #000000

WCAG 8.15:1 (AAA) · APCA Lc 52

Contrast pairs

코드 스니펫

CSS

:root {
  --extra-life: #6ab417;
  --extra-life-rgb: 106 180 23;
  --extra-life-oklch: oklch(0.695 0.19 133.2);
}

.element {
  color: var(--extra-life);
  background-color: hsl(88 77% 40%);
  border-color: oklch(0.695 0.19 133.2);
}

Tailwind CSS v4

@theme {
  --color-extra-life: #6ab417;
  --color-extra-life-50: #deffcc;
  --color-extra-life-100: #cdf7b7;
  --color-extra-life-200: #b1e794;
  --color-extra-life-300: #8bcd65;
  --color-extra-life-400: #6fb52a;
  --color-extra-life-500: #4d9e00;
  --color-extra-life-600: #428600;
  --color-extra-life-700: #346b00;
  --color-extra-life-800: #294e00;
  --color-extra-life-900: #1b3600;
  --color-extra-life-950: #0c2100;
}

SCSS

$extra-life: #6ab417;
$extra-life-rgb: 106, 180, 23;
$extra-life-light: mix(#fff, $extra-life, 20%);
$extra-life-dark: mix(#000, $extra-life, 20%);

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

비슷한 이름 색상

Palettes with similar colors

도구에서 열기

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