Cor nomeada · #9FB1AB
Garden Vista
Garden Vista é #9FB1AB: rgb(159 177 171), hsl(160 10% 66%), oklch(0.745 0.022 173.7). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Gray mean? → · Garden Vista color name →
#9FB1AB
oklch(0.745 0.022 173.7)
Conversões de cor
- HEX
- #9fb1ab
- RGB
- rgb(159 177 171)
- HSL
- hsl(160 10% 66%)
- HWB
- hwb(160 62% 31%)
- OKLCH
- oklch(0.745 0.022 173.7)
- OKLab
- oklab(0.745 -0.022 0.002)
- CIE Lab
- lab(70.66 -7.37 0.84)
- LCH
- lch(70.66 7.42 173.5)
- CMYK
- cmyk(10% 0% 3% 31%)
Tons claros · Sombras · Tons
Tons claros
- A8B9B3
- B2C0BB
- BBC8C4
- C5D0CC
- CED7D4
- D8DFDD
- E1E7E5
- EBEFEE
- F5F7F6
Sombras
- 8A9994
- 75837E
- 616C68
- 4D5754
- 3B4240
- 292F2D
- 181C1B
- 090C0B
- 010101
Tons
- 9CACA7
- 99A7A2
- 96A29E
- 939D9A
- 8F9895
- 8C9391
- 898E8D
- 868A88
- 838584
Harmonias de cor
Complementar +180°
- 9FB1AB
Garden Vista
- B8A7AD
≈ Foggy Plum
Análoga -30° +30°
- 9FB1AB
Garden Vista
- A4B0A4
≈ Powdered Gum
- 9DB1B2
≈ Aqua-Sphere
Tríade +120° +240°
- 9FB1AB
Garden Vista
- ADAAB9
≈ Lilac Bloom
- B8A9A0
≈ Riveter Rose
Complementar dividida +150° +210°
- 9FB1AB
Garden Vista
- B3A8B4
≈ Resplendent
- BAA7A6
≈ Object of Desire
Tétrade +90° +180° +270°
- 9FB1AB
Garden Vista
- A5ACBB
≈ Snub
- B8A7AD
≈ Foggy Plum
- B3AB9D
≈ Terrace Taupe
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 2.24:1 · APCA Lc 44
Ag
AAASobre preto
WCAG 9.35:1 · APCA Lc 58
Melhor cor de texto: #000000
WCAG 9.35:1 (AAA) · APCA Lc 58
Contrast pairs
Trechos de código
CSS
:root {
--garden-vista: #9fb1ab;
--garden-vista-rgb: 159 177 171;
--garden-vista-oklch: oklch(0.745 0.022 173.7);
}
.element {
color: var(--garden-vista);
background-color: hsl(160 10% 66%);
border-color: oklch(0.745 0.022 173.7);
}Tailwind CSS v4
@theme {
--color-garden-vista: #9fb1ab;
--color-garden-vista-50: #eff7f5;
--color-garden-vista-100: #e1eae7;
--color-garden-vista-200: #cbd7d4;
--color-garden-vista-300: #adbbb7;
--color-garden-vista-400: #92a39d;
--color-garden-vista-500: #788b85;
--color-garden-vista-600: #667670;
--color-garden-vista-700: #515e5a;
--color-garden-vista-800: #3b4541;
--color-garden-vista-900: #29302d;
--color-garden-vista-950: #161c1a;
}SCSS
$garden-vista: #9fb1ab;
$garden-vista-rgb: 159, 177, 171;
$garden-vista-light: mix(#fff, $garden-vista, 20%);
$garden-vista-dark: mix(#000, $garden-vista, 20%);
.element {
color: $garden-vista;
box-shadow: 0 0 0 2px rgba($garden-vista, 0.35);
}