Cor nomeada mais próxima · #7CC2CD
#7CC2CD
Cor nomeada mais próxima: Wavelet
#7CC2CD (rgb(124 194 205), hsl(188 45% 65%), oklch(0.772 0.072 208.4)) é mais próxima da cor nomeada Wavelet. Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
#7CC2CD
oklch(0.772 0.072 208.4)
Conversões de cor
- HEX
- #7cc2cd
- RGB
- rgb(124 194 205)
- HSL
- hsl(188 45% 65%)
- HWB
- hwb(188 49% 20%)
- OKLCH
- oklch(0.772 0.072 208.4)
- OKLab
- oklab(0.772 -0.063 -0.034)
- CIE Lab
- lab(74.1 -20.82 -12.89)
- LCH
- lch(74.1 24.49 211.8)
- CMYK
- cmyk(40% 5% 0% 20%)
Tons claros · Sombras · Tons
Tons claros
- 8AC8D2
- 98CED7
- A5D4DC
- B2DAE1
- BFE1E6
- CCE7EB
- D9EDF0
- E6F3F5
- F2F9FA
Sombras
- 6BA8B2
- 5A8F98
- 4A777E
- 3B6066
- 2C494E
- 1E3438
- 112023
- 050E0F
- 010202
Tons
- 7DBBC5
- 7FB5BD
- 80AEB5
- 80A7AE
- 81A1A6
- 819A9E
- 819497
- 818D8F
- 818687
Harmonias de cor
Complementar +180°
- 7CC2CD
Wavelet
- DFA49B
≈ Coral Cove
Análoga -30° +30°
- 7CC2CD
Wavelet
- 81C4B5
≈ Holiday
- 8ABCDE
≈ Frozen Whisper
Tríade +120° +240°
- 7CC2CD
Wavelet
- CFA5CC
≈ Geranium Bud
- C8B380
≈ Roasted Pistachio
Complementar dividida +150° +210°
- 7CC2CD
Wavelet
- DCA2B4
≈ Pink Gin
- D8AA87
≈ Sweet Sue
Tétrade +90° +180° +270°
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 2.00:1 · APCA Lc 39
Ag
AAASobre preto
WCAG 10.45:1 · APCA Lc 64
Melhor cor de texto: #000000
WCAG 10.45:1 (AAA) · APCA Lc 64
Contrast pairs
Trechos de código
CSS
:root {
--wavelet: #7cc2cd;
--wavelet-rgb: 124 194 205;
--wavelet-oklch: oklch(0.772 0.072 208.4);
}
.element {
color: var(--wavelet);
background-color: hsl(188 45% 65%);
border-color: oklch(0.772 0.072 208.4);
}Tailwind CSS v4
@theme {
--color-wavelet: #7cc2cd;
--color-wavelet-50: #dffbff;
--color-wavelet-100: #cdeff5;
--color-wavelet-200: #b2dde5;
--color-wavelet-300: #8cc2cc;
--color-wavelet-400: #69abb5;
--color-wavelet-500: #44939f;
--color-wavelet-600: #3b7d87;
--color-wavelet-700: #2f646c;
--color-wavelet-800: #20494f;
--color-wavelet-900: #153337;
--color-wavelet-950: #061f22;
}SCSS
$wavelet: #7cc2cd;
$wavelet-rgb: 124, 194, 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);
}