이름 색상 · #84B6A2
Source Green
Source Green은(는) #84B6A2: rgb(132 182 162), hsl(156 26% 62%), oklch(0.735 0.06 168). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Teal mean? → · Source Green color name →
#84B6A2
oklch(0.735 0.06 168)
색상 변환
- HEX
- #84b6a2
- RGB
- rgb(132 182 162)
- HSL
- hsl(156 26% 62%)
- HWB
- hwb(156 52% 29%)
- OKLCH
- oklch(0.735 0.06 168)
- OKLab
- oklab(0.735 -0.059 0.013)
- CIE Lab
- lab(70.08 -20.41 4.62)
- LCH
- lch(70.08 20.93 167.3)
- CMYK
- cmyk(27% 0% 11% 29%)
틴트 · 셰이드 · 톤
틴트
- 90BDAB
- 9DC4B4
- A9CCBD
- B5D3C6
- C1DAD0
- CEE2D9
- DAE9E2
- E6F0EC
- F3F8F5
셰이드
- 729E8C
- 608677
- 4F6F63
- 3F594F
- 2F443C
- 20302A
- 121D19
- 060C0A
- 010201
톤
- 84B19F
- 84AB9B
- 84A698
- 84A094
- 839B91
- 83958D
- 82908A
- 828B87
- 818583
색 조화
보색 +180°
- 84B6A2
Source Green
- C79AB0
≈ Lady’s Cushions Pink
유사색 -30° +30°
- 84B6A2
Source Green
- 97B38E
≈ Basilisk
- 7BB5B7
≈ Kingfisher Turquoise
삼각 배색 +120° +240°
- 84B6A2
Source Green
- A7A4CE
≈ Puturple
- CA9E89
≈ Artefact
분열 보색 +150° +210°
- 84B6A2
Source Green
- BA9EC2
≈ Lupine
- CD9A9B
≈ Silk Stone
사각 배색 +90° +180° +270°
- 84B6A2
Source Green
- 92ABD0
≈ Hopeful Dream
- C79AB0
≈ Lady’s Cushions Pink
- BFA57E
≈ Graham Cracker
대비 및 접근성
Ag
Fail흰색 위
WCAG 2.28:1 · APCA Lc 45
Ag
AAA검은색 위
WCAG 9.19:1 · APCA Lc 57
가장 좋은 글자색: #000000
WCAG 9.19:1 (AAA) · APCA Lc 57
Contrast pairs
코드 스니펫
CSS
:root {
--source-green: #84b6a2;
--source-green-rgb: 132 182 162;
--source-green-oklch: oklch(0.735 0.06 168);
}
.element {
color: var(--source-green);
background-color: hsl(156 26% 62%);
border-color: oklch(0.735 0.06 168);
}Tailwind CSS v4
@theme {
--color-source-green: #84b6a2;
--color-source-green-50: #e5fbf2;
--color-source-green-100: #d5efe5;
--color-source-green-200: #bcddd0;
--color-source-green-300: #99c2b3;
--color-source-green-400: #7baa98;
--color-source-green-500: #5d937e;
--color-source-green-600: #4f7d6b;
--color-source-green-700: #3f6456;
--color-source-green-800: #2e493e;
--color-source-green-900: #1f332a;
--color-source-green-950: #0e1e18;
}SCSS
$source-green: #84b6a2;
$source-green-rgb: 132, 182, 162;
$source-green-light: mix(#fff, $source-green, 20%);
$source-green-dark: mix(#000, $source-green, 20%);
.element {
color: $source-green;
box-shadow: 0 0 0 2px rgba($source-green, 0.35);
}