Cor nomeada · #A5B2AA
Marine Grey
Marine Grey é #A5B2AA: rgb(165 178 170), hsl(143 8% 67%), oklch(0.751 0.018 159). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Gray mean? → · Marine Grey color name →
#A5B2AA
oklch(0.751 0.018 159)
Conversões de cor
- HEX
- #a5b2aa
- RGB
- rgb(165 178 170)
- HSL
- hsl(143 8% 67%)
- HWB
- hwb(143 65% 30%)
- OKLCH
- oklch(0.751 0.018 159)
- OKLab
- oklab(0.751 -0.017 0.007)
- CIE Lab
- lab(71.37 -5.86 2.46)
- LCH
- lch(71.37 6.35 157.2)
- CMYK
- cmyk(7% 0% 4% 30%)
Tons claros · Sombras · Tons
Tons claros
- AEB9B2
- B6C1BA
- BFC9C3
- C8D0CB
- D1D8D4
- DAE0DC
- E3E7E5
- ECEFEE
- F6F7F6
Sombras
- 8F9A93
- 79837D
- 656D68
- 515753
- 3D433F
- 2B2F2D
- 1A1D1B
- 0A0C0B
- 010101
Tons
- A1ADA6
- 9EA8A1
- 9AA39D
- 969E99
- 929995
- 8F9491
- 8B8F8C
- 878A88
- 848584
Harmonias de cor
Complementar +180°
- A5B2AA
Marine Grey
- B7AAB2
≈ Lavender Cloud
Análoga -30° +30°
- A5B2AA
Marine Grey
- ABB1A5
≈ Pebble Walk
- A2B2B0
≈ Conch
Tríade +120° +240°
- A5B2AA
Marine Grey
- ABADBA
≈ Eclectic
- B9ABA6
≈ Embarrassed Shadow
Complementar dividida +150° +210°
- A5B2AA
Marine Grey
- B2ABB7
≈ Chatelle
- B9AAAC
≈ Aniline Mauve
Tétrade +90° +180° +270°
- A5B2AA
Marine Grey
- A6B0BA
≈ Berry Chalk
- B7AAB2
≈ Lavender Cloud
- B6ACA2
≈ Perfect Taupe
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 2.19:1 · APCA Lc 43
Ag
AAASobre preto
WCAG 9.54:1 · APCA Lc 59
Melhor cor de texto: #000000
WCAG 9.54:1 (AAA) · APCA Lc 59
Contrast pairs
Trechos de código
CSS
:root {
--marine-grey: #a5b2aa;
--marine-grey-rgb: 165 178 170;
--marine-grey-oklch: oklch(0.751 0.018 159);
}
.element {
color: var(--marine-grey);
background-color: hsl(143 8% 67%);
border-color: oklch(0.751 0.018 159);
}Tailwind CSS v4
@theme {
--color-marine-grey: #a5b2aa;
--color-marine-grey-50: #f1f7f3;
--color-marine-grey-100: #e3eae6;
--color-marine-grey-200: #ced7d2;
--color-marine-grey-300: #b0bab4;
--color-marine-grey-400: #96a29a;
--color-marine-grey-500: #7c8a82;
--color-marine-grey-600: #69756e;
--color-marine-grey-700: #545d58;
--color-marine-grey-800: #3d4440;
--color-marine-grey-900: #2a2f2c;
--color-marine-grey-950: #181c19;
}SCSS
$marine-grey: #a5b2aa;
$marine-grey-rgb: 165, 178, 170;
$marine-grey-light: mix(#fff, $marine-grey, 20%);
$marine-grey-dark: mix(#000, $marine-grey, 20%);
.element {
color: $marine-grey;
box-shadow: 0 0 0 2px rgba($marine-grey, 0.35);
}