Cor nomeada · #B2E191
Sage Sensation
Sage Sensation é #B2E191: rgb(178 225 145), hsl(95 57% 73%), oklch(0.858 0.117 133.1). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Green mean? → · Sage Sensation color name →
#B2E191
oklch(0.858 0.117 133.1)
Conversões de cor
- HEX
- #b2e191
- RGB
- rgb(178 225 145)
- HSL
- hsl(95 57% 73%)
- HWB
- hwb(95 57% 12%)
- OKLCH
- oklch(0.858 0.117 133.1)
- OKLab
- oklab(0.858 -0.08 0.085)
- CIE Lab
- lab(84.79 -26.26 34.03)
- LCH
- lch(84.79 42.99 127.7)
- CMYK
- cmyk(21% 0% 36% 12%)
Tons claros · Sombras · Tons
Tons claros
- BAE49C
- C1E7A8
- C9EAB3
- D1EEBE
- D8F1C9
- E0F4D4
- E8F6DF
- F0F9E9
- F7FCF4
Sombras
- 9AC47D
- 83A76A
- 6D8B58
- 577046
- 435635
- 2F3E25
- 1D2715
- 0C1207
- 010201
Tons
- ADD790
- A8CD8F
- A3C38D
- 9EB98C
- 99B08A
- 94A688
- 8F9C87
- 8A9384
- 858982
Harmonias de cor
Complementar +180°
- B2E191
Sage Sensation
- E7BDFF
≈ Euphoria
Análoga -30° +30°
- B2E191
Sage Sensation
- DED476
≈ Golden Rice
- 82E8BA
≈ Jittery Jade
Tríade +120° +240°
- B2E191
Sage Sensation
- AFD4FF
≈ Ice Cold Stare
- FFBCC1
≈ A Lot of Love
Complementar dividida +150° +210°
- B2E191
Sage Sensation
- C9CBFF
≈ Lavender Blue
- FFB6E1
≈ Hot Aquarelle Pink
Tétrade +90° +180° +270°
- B2E191
Sage Sensation
- 84DFFF
≈ Tranquil Pool
- E7BDFF
≈ Euphoria
- FFBFA6
≈ Sweet Apricot
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.49:1 · APCA Lc 23
Ag
AAASobre preto
WCAG 14.07:1 · APCA Lc 80
Melhor cor de texto: #000000
WCAG 14.07:1 (AAA) · APCA Lc 80
Contrast pairs
Trechos de código
CSS
:root {
--sage-sensation: #b2e191;
--sage-sensation-rgb: 178 225 145;
--sage-sensation-oklch: oklch(0.858 0.117 133.1);
}
.element {
color: var(--sage-sensation);
background-color: hsl(95 57% 73%);
border-color: oklch(0.858 0.117 133.1);
}Tailwind CSS v4
@theme {
--color-sage-sensation: #b2e191;
--color-sage-sensation-50: #e7fddc;
--color-sage-sensation-100: #d7f1ca;
--color-sage-sensation-200: #bfe0ae;
--color-sage-sensation-300: #9ec589;
--color-sage-sensation-400: #83ad64;
--color-sage-sensation-500: #669640;
--color-sage-sensation-600: #577f37;
--color-sage-sensation-700: #45662c;
--color-sage-sensation-800: #344a1c;
--color-sage-sensation-900: #233413;
--color-sage-sensation-950: #121f05;
}SCSS
$sage-sensation: #b2e191;
$sage-sensation-rgb: 178, 225, 145;
$sage-sensation-light: mix(#fff, $sage-sensation, 20%);
$sage-sensation-dark: mix(#000, $sage-sensation, 20%);
.element {
color: $sage-sensation;
box-shadow: 0 0 0 2px rgba($sage-sensation, 0.35);
}