Dichtstbijzijnde benoemde kleur · #80C4CA
#80C4CA
Dichtstbijzijnde benoemde kleur: Wavelet
#80C4CA (rgb(128 196 202), hsl(185 41% 65%), oklch(0.777 0.069 202.9)) komt het dichtst bij de benoemde kleur Wavelet. Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
#80C4CA
oklch(0.777 0.069 202.9)
Kleurconversies
- HEX
- #80c4ca
- RGB
- rgb(128 196 202)
- HSL
- hsl(185 41% 65%)
- HWB
- hwb(185 50% 21%)
- OKLCH
- oklch(0.777 0.069 202.9)
- OKLab
- oklab(0.777 -0.064 -0.027)
- CIE Lab
- lab(74.8 -21.21 -10.22)
- LCH
- lch(74.8 23.55 205.7)
- CMYK
- cmyk(37% 3% 0% 21%)
Tinten · Schaduwen · Tonen
Tinten
- 8DCACF
- 9BD0D4
- A8D6DA
- B4DCDF
- C1E2E4
- CDE7EA
- DAEDEF
- E6F3F4
- F3F9FA
Schaduwen
- 6EAAAF
- 5D9195
- 4D787C
- 3D6164
- 2E4A4D
- 1F3537
- 122122
- 060E0F
- 010202
Tonen
- 81BDC2
- 82B6BB
- 82AFB3
- 82A8AC
- 83A2A4
- 829B9D
- 829496
- 828D8E
- 818787
Kleurharmonieën
Complementair +180°
- 80C4CA
Wavelet
- E0A6A2
≈ Pastel Pink
Analoog -30° +30°
- 80C4CA
Wavelet
- 88C5B2
≈ Hellion Green
- 8ABFDC
≈ High Elf Blue
Triadisch +120° +240°
- 80C4CA
Wavelet
- CCA8D1
≈ Graceful Garden
- CCB384
≈ Oak Harbour
Gesplitst complementair +150° +210°
- 80C4CA
Wavelet
- DBA5BA
≈ Pink Gin
- DBAB8E
≈ Salmon Sand
Tetradisch +90° +180° +270°
Contrast en toegankelijkheid
Ag
FailOp wit
WCAG 1.96:1 · APCA Lc 38
Ag
AAAOp zwart
WCAG 10.66:1 · APCA Lc 65
Beste tekstkleur: #000000
WCAG 10.66:1 (AAA) · APCA Lc 65
Contrast pairs
Codefragmenten
CSS
:root {
--wavelet: #80c4ca;
--wavelet-rgb: 128 196 202;
--wavelet-oklch: oklch(0.777 0.069 202.9);
}
.element {
color: var(--wavelet);
background-color: hsl(185 41% 65%);
border-color: oklch(0.777 0.069 202.9);
}Tailwind CSS v4
@theme {
--color-wavelet: #80c4ca;
--color-wavelet-50: #dffbff;
--color-wavelet-100: #ceeff3;
--color-wavelet-200: #b3dde2;
--color-wavelet-300: #8ec2c8;
--color-wavelet-400: #6babb0;
--color-wavelet-500: #47949a;
--color-wavelet-600: #3d7d83;
--color-wavelet-700: #316469;
--color-wavelet-800: #224a4c;
--color-wavelet-900: #173335;
--color-wavelet-950: #071f20;
}SCSS
$wavelet: #80c4ca;
$wavelet-rgb: 128, 196, 202;
$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);
}