Cor nomeada · #9BAFB2
Interesting Aqua
Interesting Aqua é #9BAFB2: rgb(155 175 178), hsl(188 13% 65%), oklch(0.74 0.023 207.6). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Gray mean? → · Interesting Aqua color name →
#9BAFB2
oklch(0.74 0.023 207.6)
Conversões de cor
- HEX
- #9bafb2
- RGB
- rgb(155 175 178)
- HSL
- hsl(188 13% 65%)
- HWB
- hwb(188 61% 30%)
- OKLCH
- oklch(0.74 0.023 207.6)
- OKLab
- oklab(0.74 -0.02 -0.01)
- CIE Lab
- lab(69.98 -6.71 -4.02)
- LCH
- lch(69.98 7.83 210.9)
- CMYK
- cmyk(13% 2% 0% 30%)
Tons claros · Sombras · Tons
Tons claros
- A5B7B9
- AEBFC1
- B8C6C9
- C2CED0
- CCD6D8
- D6DEE0
- E0E6E7
- EAEFEF
- F5F7F7
Sombras
- 86989A
- 728183
- 5E6B6D
- 4B5657
- 394143
- 282E2F
- 181C1D
- 090B0C
- 010101
Tons
- 98AAAD
- 96A5A8
- 93A1A3
- 909C9E
- 8E9799
- 8B9394
- 888E8F
- 85898A
- 838585
Harmonias de cor
Complementar +180°
- 9BAFB2
Interesting Aqua
- B9A6A3
≈ Martini
Análoga -30° +30°
- 9BAFB2
Interesting Aqua
- 9CB0AA
≈ Grey Morning
- 9EADB8
≈ Shower
Tríade +120° +240°
- 9BAFB2
Interesting Aqua
- B3A6B2
≈ Plum Frost
- B1AA9B
≈ Bright Sepia
Complementar dividida +150° +210°
- 9BAFB2
Interesting Aqua
- B7A5AB
≈ Foggy Plum
- B6A79D
≈ Prestige
Tétrade +90° +180° +270°
- 9BAFB2
Interesting Aqua
- ACA8B8
≈ Morning Mist Grey
- B9A6A3
≈ Martini
- A9AD9D
≈ Meditation
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 2.29:1 · APCA Lc 45
Ag
AAASobre preto
WCAG 9.16:1 · APCA Lc 57
Melhor cor de texto: #000000
WCAG 9.16:1 (AAA) · APCA Lc 57
Contrast pairs
Trechos de código
CSS
:root {
--interesting-aqua: #9bafb2;
--interesting-aqua-rgb: 155 175 178;
--interesting-aqua-oklch: oklch(0.74 0.023 207.6);
}
.element {
color: var(--interesting-aqua);
background-color: hsl(188 13% 65%);
border-color: oklch(0.74 0.023 207.6);
}Tailwind CSS v4
@theme {
--color-interesting-aqua: #9bafb2;
--color-interesting-aqua-50: #eef7f9;
--color-interesting-aqua-100: #e0eaec;
--color-interesting-aqua-200: #cad7d9;
--color-interesting-aqua-300: #abbbbe;
--color-interesting-aqua-400: #90a2a5;
--color-interesting-aqua-500: #758b8e;
--color-interesting-aqua-600: #647578;
--color-interesting-aqua-700: #4f5e60;
--color-interesting-aqua-800: #3a4546;
--color-interesting-aqua-900: #273031;
--color-interesting-aqua-950: #161c1d;
}SCSS
$interesting-aqua: #9bafb2;
$interesting-aqua-rgb: 155, 175, 178;
$interesting-aqua-light: mix(#fff, $interesting-aqua, 20%);
$interesting-aqua-dark: mix(#000, $interesting-aqua, 20%);
.element {
color: $interesting-aqua;
box-shadow: 0 0 0 2px rgba($interesting-aqua, 0.35);
}