이름 색상 · #77B244
Sparkling Apple
Sparkling Apple은(는) #77B244: rgb(119 178 68), hsl(92 45% 48%), oklch(0.7 0.155 132.9). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Green mean? → · Sparkling Apple color name →
#77B244
oklch(0.7 0.155 132.9)
색상 변환
- HEX
- #77b244
- RGB
- rgb(119 178 68)
- HSL
- hsl(92 45% 48%)
- HWB
- hwb(92 27% 30%)
- OKLCH
- oklch(0.7 0.155 132.9)
- OKLab
- oklab(0.7 -0.105 0.113)
- CIE Lab
- lab(66.8 -33.81 48.25)
- LCH
- lch(66.8 58.92 125)
- CMYK
- cmyk(33% 0% 62% 30%)
틴트 · 셰이드 · 톤
틴트
- 84BA5A
- 92C26E
- 9FCA81
- ADD193
- BAD9A5
- C8E1B7
- D6E8C9
- E3F0DB
- F1F8ED
셰이드
- 679A3A
- 578330
- 476D26
- 38571D
- 2A4314
- 1C2F0C
- 101D05
- 050C02
- 010100
톤
- 78AD4D
- 7AA855
- 7BA35C
- 7C9F63
- 7D9A68
- 7E956E
- 7E9073
- 7F8A77
- 80857C
색 조화
보색 +180°
- 77B244
Sparkling Apple
- BF7FE2
≈ Lavender Blossom
유사색 -30° +30°
- 77B244
Sparkling Apple
- B0A100
≈ Venom
- 00BB83
≈ Slime Girl
삼각 배색 +120° +240°
- 77B244
Sparkling Apple
- 50A1FB
≈ Feather Star
- EE7183
≈ Rose Cheeks
분열 보색 +150° +210°
- 77B244
Sparkling Apple
- 928FFB
≈ Lavender Blue Shadow
- DE73B8
≈ Purple Hollyhock
사각 배색 +90° +180° +270°
- 77B244
Sparkling Apple
- 00AFD9
≈ Bright Cerulean
- BF7FE2
≈ Lavender Blossom
- EC7A48
≈ Ouni Red
대비 및 접근성
Ag
Fail흰색 위
WCAG 2.54:1 · APCA Lc 50
Ag
AAA검은색 위
WCAG 8.23:1 · APCA Lc 52
가장 좋은 글자색: #000000
WCAG 8.23:1 (AAA) · APCA Lc 52
Contrast pairs
코드 스니펫
CSS
:root {
--sparkling-apple: #77b244;
--sparkling-apple-rgb: 119 178 68;
--sparkling-apple-oklch: oklch(0.7 0.155 132.9);
}
.element {
color: var(--sparkling-apple);
background-color: hsl(92 45% 48%);
border-color: oklch(0.7 0.155 132.9);
}Tailwind CSS v4
@theme {
--color-sparkling-apple: #77b244;
--color-sparkling-apple-50: #e3ffd3;
--color-sparkling-apple-100: #d2f4c0;
--color-sparkling-apple-200: #b8e4a0;
--color-sparkling-apple-300: #95c977;
--color-sparkling-apple-400: #79b14b;
--color-sparkling-apple-500: #5b9a0e;
--color-sparkling-apple-600: #4d8312;
--color-sparkling-apple-700: #3e6910;
--color-sparkling-apple-800: #2f4c04;
--color-sparkling-apple-900: #1f3504;
--color-sparkling-apple-950: #0f2000;
}SCSS
$sparkling-apple: #77b244;
$sparkling-apple-rgb: 119, 178, 68;
$sparkling-apple-light: mix(#fff, $sparkling-apple, 20%);
$sparkling-apple-dark: mix(#000, $sparkling-apple, 20%);
.element {
color: $sparkling-apple;
box-shadow: 0 0 0 2px rgba($sparkling-apple, 0.35);
}