Cor nomeada · #64B3D3
Shimmering Brook
Shimmering Brook é #64B3D3: rgb(100 179 211), hsl(197 56% 61%), oklch(0.728 0.09 226.4). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Cyan mean? → · Shimmering Brook color name →
#64B3D3
oklch(0.728 0.09 226.4)
Conversões de cor
- HEX
- #64b3d3
- RGB
- rgb(100 179 211)
- HSL
- hsl(197 56% 61%)
- HWB
- hwb(197 39% 17%)
- OKLCH
- oklch(0.728 0.09 226.4)
- OKLab
- oklab(0.728 -0.062 -0.066)
- CIE Lab
- lab(68.82 -18.59 -24.2)
- LCH
- lch(68.82 30.52 232.5)
- CMYK
- cmyk(53% 15% 0% 17%)
Tons claros · Sombras · Tons
Tons claros
- 75BBD8
- 85C2DC
- 95CAE1
- A5D2E5
- B4D9EA
- C3E1EE
- D2E8F2
- E1F0F7
- F0F7FB
Sombras
- 569BB7
- 48849C
- 3B6E82
- 2E5869
- 224351
- 162F3A
- 0B1D24
- 030C10
- 000102
Tons
- 69AECB
- 6DA9C2
- 70A4BA
- 739FB1
- 769AA9
- 7995A1
- 7B8F99
- 7D8A90
- 7F8588
Harmonias de cor
Complementar +180°
- 64B3D3
Shimmering Brook
- D79676
≈ Sweet Cardamom
Análoga -30° +30°
- 64B3D3
Shimmering Brook
- 59B9BA
≈ Dickie Bird
- 82AAE0
≈ Swift
Tríade +120° +240°
- 64B3D3
Shimmering Brook
- D190B3
≈ Moonlit Mauve
- AEAB66
≈ Organic Garden
Complementar dividida +150° +210°
- 64B3D3
Shimmering Brook
- DA9093
≈ Pink Clay Pot
- C8A064
≈ Sunrise Heat
Tétrade +90° +180° +270°
- 64B3D3
Shimmering Brook
- BE96CE
≈ Amethyst Show
- D79676
≈ Sweet Cardamom
- 8DB57C
≈ Flavoparmelia Caperata
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 2.35:1 · APCA Lc 46
Ag
AAASobre preto
WCAG 8.93:1 · APCA Lc 56
Melhor cor de texto: #000000
WCAG 8.93:1 (AAA) · APCA Lc 56
Contrast pairs
Trechos de código
CSS
:root {
--shimmering-brook: #64b3d3;
--shimmering-brook-rgb: 100 179 211;
--shimmering-brook-oklch: oklch(0.728 0.09 226.4);
}
.element {
color: var(--shimmering-brook);
background-color: hsl(197 56% 61%);
border-color: oklch(0.728 0.09 226.4);
}Tailwind CSS v4
@theme {
--color-shimmering-brook: #64b3d3;
--color-shimmering-brook-50: #dcfbff;
--color-shimmering-brook-100: #caefff;
--color-shimmering-brook-200: #adddf3;
--color-shimmering-brook-300: #86c1dc;
--color-shimmering-brook-400: #5faac8;
--color-shimmering-brook-500: #3592b4;
--color-shimmering-brook-600: #2f7c98;
--color-shimmering-brook-700: #25637a;
--color-shimmering-brook-800: #18495a;
--color-shimmering-brook-900: #10333f;
--color-shimmering-brook-950: #021e28;
}SCSS
$shimmering-brook: #64b3d3;
$shimmering-brook-rgb: 100, 179, 211;
$shimmering-brook-light: mix(#fff, $shimmering-brook, 20%);
$shimmering-brook-dark: mix(#000, $shimmering-brook, 20%);
.element {
color: $shimmering-brook;
box-shadow: 0 0 0 2px rgba($shimmering-brook, 0.35);
}