Cor nomeada · #61BA85
Green Garter
Green Garter é #61BA85: rgb(97 186 133), hsl(144 39% 55%), oklch(0.719 0.117 155.8). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Green mean? → · Green Garter color name →
#61BA85
oklch(0.719 0.117 155.8)
Conversões de cor
- HEX
- #61ba85
- RGB
- rgb(97 186 133)
- HSL
- hsl(144 39% 55%)
- HWB
- hwb(144 38% 27%)
- OKLCH
- oklch(0.719 0.117 155.8)
- OKLab
- oklab(0.719 -0.106 0.048)
- CIE Lab
- lab(68.96 -37.15 18.37)
- LCH
- lch(68.96 41.45 153.7)
- CMYK
- cmyk(48% 0% 28% 27%)
Tons claros · Sombras · Tons
Tons claros
- 73C191
- 84C89D
- 94CFA9
- A4D6B5
- B3DDC1
- C2E4CD
- D2EBDA
- E1F1E6
- F0F8F2
Sombras
- 53A173
- 468961
- 397250
- 2D5C40
- 214630
- 153221
- 0B1E13
- 030D06
- 000201
Tons
- 66B485
- 6BAE84
- 6FA984
- 72A384
- 759D83
- 789783
- 7A9282
- 7D8C81
- 7E8681
Harmonias de cor
Complementar +180°
- 61BA85
Green Garter
- D287C0
≈ Cyclamen
Análoga -30° +30°
- 61BA85
Green Garter
- 92B15D
≈ Asparagus Cream
- 2EBCAF
≈ Turquoise Topaz
Tríade +120° +240°
- 61BA85
Green Garter
- 909EED
≈ Cold Lips
- E38971
≈ Guava Jam
Complementar dividida +150° +210°
- 61BA85
Green Garter
- B691DE
≈ Dreamy Candy Forest
- E18499
≈ Rose Soiree
Tétrade +90° +180° +270°
- 61BA85
Green Garter
- 62ABE9
≈ Blue Jeans
- D287C0
≈ Cyclamen
- D6954F
≈ Salt Caramel
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 2.36:1 · APCA Lc 46
Ag
AAASobre preto
WCAG 8.87:1 · APCA Lc 56
Melhor cor de texto: #000000
WCAG 8.87:1 (AAA) · APCA Lc 56
Contrast pairs
Trechos de código
CSS
:root {
--green-garter: #61ba85;
--green-garter-rgb: 97 186 133;
--green-garter-oklch: oklch(0.719 0.117 155.8);
}
.element {
color: var(--green-garter);
background-color: hsl(144 39% 55%);
border-color: oklch(0.719 0.117 155.8);
}Tailwind CSS v4
@theme {
--color-green-garter: #61ba85;
--color-green-garter-50: #dbffe8;
--color-green-garter-100: #c8f4d9;
--color-green-garter-200: #abe4c1;
--color-green-garter-300: #83caa0;
--color-green-garter-400: #5fb381;
--color-green-garter-500: #349c64;
--color-green-garter-600: #2e8455;
--color-green-garter-700: #256a44;
--color-green-garter-800: #1b4e2f;
--color-green-garter-900: #123620;
--color-green-garter-950: #04210f;
}SCSS
$green-garter: #61ba85;
$green-garter-rgb: 97, 186, 133;
$green-garter-light: mix(#fff, $green-garter, 20%);
$green-garter-dark: mix(#000, $green-garter, 20%);
.element {
color: $green-garter;
box-shadow: 0 0 0 2px rgba($green-garter, 0.35);
}