Named color · #56B3C3
Aqua Verde
Aqua Verde is #56B3C3: rgb(86 179 195), hsl(189 48% 55%), oklch(0.716 0.091 210.3). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Cyan mean? → · Aqua Verde color name →
#56B3C3
oklch(0.716 0.091 210.3)
Color conversions
- HEX
- #56b3c3
- RGB
- rgb(86 179 195)
- HSL
- hsl(189 48% 55%)
- HWB
- hwb(189 34% 24%)
- OKLCH
- oklch(0.716 0.091 210.3)
- OKLab
- oklab(0.716 -0.078 -0.046)
- CIE Lab
- lab(67.8 -25.32 -17.06)
- LCH
- lch(67.8 30.53 214)
- CMYK
- cmyk(56% 8% 0% 24%)
Tints · Shades · Tones
Tints
- 6ABBC9
- 7CC2CF
- 8ECAD5
- 9FD2DB
- AFD9E1
- BFE1E7
- CFE8ED
- DFF0F3
- EFF7F9
Shades
- 4A9BA9
- 3E8490
- 326E78
- 275860
- 1C434A
- 122F34
- 081D20
- 020C0E
- 000102
Tones
- 5DAEBC
- 63A9B5
- 69A4AF
- 6D9FA8
- 719AA1
- 75959A
- 788F94
- 7B8A8D
- 7E8587
Color harmonies
Complementary +180°
- 56B3C3
Aqua Verde
- D68E81
≈ My Pink
Analogous -30° +30°
- 56B3C3
Aqua Verde
- 5CB6A6
≈ Shylock
- 6DABD7
≈ Chronus Blue
Triadic +120° +240°
- 56B3C3
Aqua Verde
- C48FBE
≈ La la Love
- B9A15F
≈ Frickles
Split-complementary +150° +210°
- 56B3C3
Aqua Verde
- D38BA1
≈ Kiss
- CE9668
≈ Glazed Pecan
Tetradic +90° +180° +270°
- 56B3C3
Aqua Verde
- AC97D4
≈ Biloba Flower
- D68E81
≈ My Pink
- 9CAC6B
≈ Gallant Green
Contrast & accessibility
Ag
FailOn white
WCAG 2.43:1 · APCA Lc 48
Ag
AAAOn black
WCAG 8.63:1 · APCA Lc 54
Best text color: #000000
WCAG 8.63:1 (AAA) · APCA Lc 54
Contrast pairs
Code snippets
CSS
:root {
--aqua-verde: #56b3c3;
--aqua-verde-rgb: 86 179 195;
--aqua-verde-oklch: oklch(0.716 0.091 210.3);
}
.element {
color: var(--aqua-verde);
background-color: hsl(189 48% 55%);
border-color: oklch(0.716 0.091 210.3);
}Tailwind CSS v4
@theme {
--color-aqua-verde: #56b3c3;
--color-aqua-verde-50: #d9fdff;
--color-aqua-verde-100: #c6f1fa;
--color-aqua-verde-200: #a8dfeb;
--color-aqua-verde-300: #7fc4d3;
--color-aqua-verde-400: #56adbc;
--color-aqua-verde-500: #2196a7;
--color-aqua-verde-600: #207f8d;
--color-aqua-verde-700: #1a6671;
--color-aqua-verde-800: #104b53;
--color-aqua-verde-900: #0a343a;
--color-aqua-verde-950: #001f24;
}SCSS
$aqua-verde: #56b3c3;
$aqua-verde-rgb: 86, 179, 195;
$aqua-verde-light: mix(#fff, $aqua-verde, 20%);
$aqua-verde-dark: mix(#000, $aqua-verde, 20%);
.element {
color: $aqua-verde;
box-shadow: 0 0 0 2px rgba($aqua-verde, 0.35);
}