Cor nomeada mais próxima · #81B6CC
#81B6CC
Cor nomeada mais próxima: Juvie
#81B6CC (rgb(129 182 204), hsl(198 42% 65%), oklch(0.747 0.064 225.7)) é mais próxima da cor nomeada Juvie. Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
#81B6CC
oklch(0.747 0.064 225.7)
Conversões de cor
- HEX
- #81b6cc
- RGB
- rgb(129 182 204)
- HSL
- hsl(198 42% 65%)
- HWB
- hwb(198 51% 20%)
- OKLCH
- oklch(0.747 0.064 225.7)
- OKLab
- oklab(0.747 -0.045 -0.046)
- CIE Lab
- lab(70.93 -13.89 -17.05)
- LCH
- lch(70.93 21.99 230.8)
- CMYK
- cmyk(37% 11% 0% 20%)
Tons claros · Sombras · Tons
Tons claros
- 8EBDD1
- 9BC4D6
- A7CCDB
- B4D3E0
- C0DAE6
- CDE2EB
- D9E9F0
- E6F0F5
- F2F8FA
Sombras
- 6F9EB1
- 5E8697
- 4E6F7E
- 3E5965
- 2E444E
- 1F3037
- 121D22
- 060C0F
- 010202
Tons
- 82B1C4
- 82ABBC
- 82A6B5
- 82A0AD
- 829BA5
- 82959E
- 829096
- 818B8F
- 818587
Harmonias de cor
Complementar +180°
- 81B6CC
Juvie
- D0A18B
≈ Shiny Kettle
Análoga -30° +30°
- 81B6CC
Juvie
- 7CBABA
≈ Polished Aqua
- 93AFD6
≈ Lazy Day
Tríade +120° +240°
- 81B6CC
Juvie
- CC9DB6
≈ Idyllic Pink
- B2B081
≈ Weeping Willow
Complementar dividida +150° +210°
- 81B6CC
Juvie
- D29D9F
≈ Rosewood Apricot
- C5A880
≈ Pony
Tétrade +90° +180° +270°
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 2.21:1 · APCA Lc 43
Ag
AAASobre preto
WCAG 9.49:1 · APCA Lc 59
Melhor cor de texto: #000000
WCAG 9.49:1 (AAA) · APCA Lc 59
Contrast pairs
Trechos de código
CSS
:root {
--juvie: #81b6cc;
--juvie-rgb: 129 182 204;
--juvie-oklch: oklch(0.747 0.064 225.7);
}
.element {
color: var(--juvie);
background-color: hsl(198 42% 65%);
border-color: oklch(0.747 0.064 225.7);
}Tailwind CSS v4
@theme {
--color-juvie: #81b6cc;
--color-juvie-50: #e3f9ff;
--color-juvie-100: #d3edf9;
--color-juvie-200: #b9daea;
--color-juvie-300: #96bfd1;
--color-juvie-400: #75a7bb;
--color-juvie-500: #558fa7;
--color-juvie-600: #49798d;
--color-juvie-700: #3a6171;
--color-juvie-800: #284753;
--color-juvie-900: #1b313a;
--color-juvie-950: #0b1d24;
}SCSS
$juvie: #81b6cc;
$juvie-rgb: 129, 182, 204;
$juvie-light: mix(#fff, $juvie, 20%);
$juvie-dark: mix(#000, $juvie, 20%);
.element {
color: $juvie;
box-shadow: 0 0 0 2px rgba($juvie, 0.35);
}