이름 색상 · #A4DDD3
Sparkling Mint
Sparkling Mint은(는) #A4DDD3: rgb(164 221 211), hsl(169 46% 75%), oklch(0.856 0.06 182.9). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Teal mean? → · Sparkling Mint color name →
#A4DDD3
oklch(0.856 0.06 182.9)
색상 변환
- HEX
- #a4ddd3
- RGB
- rgb(164 221 211)
- HSL
- hsl(169 46% 75%)
- HWB
- hwb(169 64% 13%)
- OKLCH
- oklch(0.856 0.06 182.9)
- OKLab
- oklab(0.856 -0.06 -0.003)
- CIE Lab
- lab(83.99 -20.5 -1.31)
- LCH
- lch(83.99 20.54 183.6)
- CMYK
- cmyk(26% 0% 5% 13%)
틴트 · 셰이드 · 톤
틴트
- ADE0D7
- B7E4DC
- C0E7E0
- C9EBE4
- D2EEE9
- DBF2ED
- E4F5F2
- EDF8F6
- F6FCFB
셰이드
- 8EC0B7
- 79A49C
- 648882
- 506E69
- 3D5551
- 2B3D3A
- 1A2624
- 0A1110
- 010202
톤
- A1D3CA
- 9ECAC2
- 9AC0B9
- 97B7B1
- 93AEA9
- 8FA4A0
- 8C9B98
- 889290
- 848988
색 조화
보색 +180°
- A4DDD3
Sparkling Mint
- F3C0CC
≈ Azalea Flower
유사색 -30° +30°
- A4DDD3
Sparkling Mint
- B3DCBD
≈ Ice Mist
- A2DBE7
≈ Havana Blue
삼각 배색 +120° +240°
- A4DDD3
Sparkling Mint
- D7C7F1
≈ Soap
- EDC8A8
≈ Caramel Ice
분열 보색 +150° +210°
- A4DDD3
Sparkling Mint
- E8C2E1
≈ Sweet Alyssum
- F4C2B7
≈ Rustique
사각 배색 +90° +180° +270°
- A4DDD3
Sparkling Mint
- C2CEF8
≈ Frost Fairy
- F3C0CC
≈ Azalea Flower
- DDCFA3
≈ Summer Solstice
대비 및 접근성
Ag
Fail흰색 위
WCAG 1.51:1 · APCA Lc 24
Ag
AAA검은색 위
WCAG 13.86:1 · APCA Lc 79
가장 좋은 글자색: #000000
WCAG 13.86:1 (AAA) · APCA Lc 79
Contrast pairs
코드 스니펫
CSS
:root {
--sparkling-mint: #a4ddd3;
--sparkling-mint-rgb: 164 221 211;
--sparkling-mint-oklch: oklch(0.856 0.06 182.9);
}
.element {
color: var(--sparkling-mint);
background-color: hsl(169 46% 75%);
border-color: oklch(0.856 0.06 182.9);
}Tailwind CSS v4
@theme {
--color-sparkling-mint: #a4ddd3;
--color-sparkling-mint-50: #e3fbf7;
--color-sparkling-mint-100: #d3efea;
--color-sparkling-mint-200: #b9ddd7;
--color-sparkling-mint-300: #95c2bb;
--color-sparkling-mint-400: #76aaa2;
--color-sparkling-mint-500: #56938a;
--color-sparkling-mint-600: #497d74;
--color-sparkling-mint-700: #3a645d;
--color-sparkling-mint-800: #2a4943;
--color-sparkling-mint-900: #1c332f;
--color-sparkling-mint-950: #0c1f1b;
}SCSS
$sparkling-mint: #a4ddd3;
$sparkling-mint-rgb: 164, 221, 211;
$sparkling-mint-light: mix(#fff, $sparkling-mint, 20%);
$sparkling-mint-dark: mix(#000, $sparkling-mint, 20%);
.element {
color: $sparkling-mint;
box-shadow: 0 0 0 2px rgba($sparkling-mint, 0.35);
}