이름 색상 · #7DC4CD
Wavelet
Wavelet은(는) #7DC4CD: rgb(125 196 205), hsl(187 44% 65%), oklch(0.777 0.072 206). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Cyan mean? → · Wavelet color name →
#7DC4CD
oklch(0.777 0.072 206)
색상 변환
- HEX
- #7dc4cd
- RGB
- rgb(125 196 205)
- HSL
- hsl(187 44% 65%)
- HWB
- hwb(187 49% 20%)
- OKLCH
- oklch(0.777 0.072 206)
- OKLab
- oklab(0.777 -0.065 -0.032)
- CIE Lab
- lab(74.72 -21.48 -11.97)
- LCH
- lch(74.72 24.58 209.1)
- CMYK
- cmyk(39% 4% 0% 20%)
틴트 · 셰이드 · 톤
틴트
- 8BCAD2
- 98D0D7
- A6D6DC
- B3DCE1
- C0E2E6
- CCE7EB
- D9EDF0
- E6F3F5
- F2F9FA
셰이드
- 6CAAB2
- 5B9198
- 4B787E
- 3B6166
- 2C4A4E
- 1E3538
- 112123
- 050E0F
- 010202
톤
- 7EBDC5
- 80B6BD
- 80AFB5
- 81A8AE
- 81A2A6
- 819B9E
- 819497
- 818D8F
- 818787
색 조화
보색 +180°
- 7DC4CD
Wavelet
- E1A59E
≈ Cuticle Pink
유사색 -30° +30°
- 7DC4CD
Wavelet
- 83C6B4
≈ Aquastone
- 89BEDF
≈ Frozen Whisper
삼각 배색 +120° +240°
- 7DC4CD
Wavelet
- CFA7CF
≈ Graceful Garden
- CBB481
≈ Tweed Jacket
분열 보색 +150° +210°
- 7DC4CD
Wavelet
- DDA4B8
≈ Pink Gin
- DBAB8A
≈ Lunatic Lynx
사각 배색 +90° +180° +270°
대비 및 접근성
Ag
Fail흰색 위
WCAG 1.97:1 · APCA Lc 38
Ag
AAA검은색 위
WCAG 10.64:1 · APCA Lc 64
가장 좋은 글자색: #000000
WCAG 10.64:1 (AAA) · APCA Lc 64
Contrast pairs
코드 스니펫
CSS
:root {
--wavelet: #7dc4cd;
--wavelet-rgb: 125 196 205;
--wavelet-oklch: oklch(0.777 0.072 206);
}
.element {
color: var(--wavelet);
background-color: hsl(187 44% 65%);
border-color: oklch(0.777 0.072 206);
}Tailwind CSS v4
@theme {
--color-wavelet: #7dc4cd;
--color-wavelet-50: #defbff;
--color-wavelet-100: #cdeff5;
--color-wavelet-200: #b1dde4;
--color-wavelet-300: #8cc2cb;
--color-wavelet-400: #69abb3;
--color-wavelet-500: #43949e;
--color-wavelet-600: #3a7d85;
--color-wavelet-700: #2e646b;
--color-wavelet-800: #204a4e;
--color-wavelet-900: #153336;
--color-wavelet-950: #061f21;
}SCSS
$wavelet: #7dc4cd;
$wavelet-rgb: 125, 196, 205;
$wavelet-light: mix(#fff, $wavelet, 20%);
$wavelet-dark: mix(#000, $wavelet, 20%);
.element {
color: $wavelet;
box-shadow: 0 0 0 2px rgba($wavelet, 0.35);
}