Cor nomeada · #B7BF6B
Avocado Cream
Avocado Cream é #B7BF6B: rgb(183 191 107), hsl(66 40% 58%), oklch(0.78 0.108 113.4). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Yellow mean? → · Avocado Cream color name →
#B7BF6B
oklch(0.78 0.108 113.4)
Conversões de cor
- HEX
- #b7bf6b
- RGB
- rgb(183 191 107)
- HSL
- hsl(66 40% 58%)
- HWB
- hwb(66 42% 25%)
- OKLCH
- oklch(0.78 0.108 113.4)
- OKLab
- oklab(0.78 -0.043 0.099)
- CIE Lab
- lab(75.31 -12.13 41.15)
- LCH
- lch(75.31 42.9 106.4)
- CMYK
- cmyk(4% 0% 44% 25%)
Tons claros · Sombras · Tons
Tons claros
- BEC57B
- C5CC8A
- CCD299
- D3D9A8
- DADFB7
- E1E6C5
- E9ECD4
- F0F2E2
- F7F9F0
Sombras
- 9FA65C
- 878D4E
- 70753F
- 5A5E32
- 454825
- 313318
- 1E1F0D
- 0C0D04
- 020200
Tons
- B1B96E
- ACB272
- A6AC74
- A0A677
- 9B9F79
- 95997B
- 90937C
- 8B8D7E
- 85867F
Harmonias de cor
Complementar +180°
- B7BF6B
Avocado Cream
- BAAAF6
≈ Winterspring Lilac
Análoga -30° +30°
- B7BF6B
Avocado Cream
- D9B162
≈ Equator
- 8DC98A
≈ De York
Tríade +120° +240°
- B7BF6B
Avocado Cream
- 6AC3F2
≈ Blue Mana
- EE9ABD
≈ Amaranth Pink
Complementar dividida +150° +210°
- B7BF6B
Avocado Cream
- 93B7FD
≈ Carolina Blue
- D9A0DF
≈ Herb Robert
Tétrade +90° +180° +270°
- B7BF6B
Avocado Cream
- 51CBD6
≈ Watercourse
- BAAAF6
≈ Winterspring Lilac
- F59B96
≈ Vinaceous
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.96:1 · APCA Lc 38
Ag
AAASobre preto
WCAG 10.67:1 · APCA Lc 65
Melhor cor de texto: #000000
WCAG 10.67:1 (AAA) · APCA Lc 65
Contrast pairs
Trechos de código
CSS
:root {
--avocado-cream: #b7bf6b;
--avocado-cream-rgb: 183 191 107;
--avocado-cream-oklch: oklch(0.78 0.108 113.4);
}
.element {
color: var(--avocado-cream);
background-color: hsl(66 40% 58%);
border-color: oklch(0.78 0.108 113.4);
}Tailwind CSS v4
@theme {
--color-avocado-cream: #b7bf6b;
--color-avocado-cream-50: #f3fad7;
--color-avocado-cream-100: #e6edc4;
--color-avocado-cream-200: #d2daa6;
--color-avocado-cream-300: #b5bf7e;
--color-avocado-cream-400: #9ea557;
--color-avocado-cream-500: #868d2c;
--color-avocado-cream-600: #727827;
--color-avocado-cream-700: #5b601f;
--color-avocado-cream-800: #444613;
--color-avocado-cream-900: #2f300c;
--color-avocado-cream-950: #1b1c01;
}SCSS
$avocado-cream: #b7bf6b;
$avocado-cream-rgb: 183, 191, 107;
$avocado-cream-light: mix(#fff, $avocado-cream, 20%);
$avocado-cream-dark: mix(#000, $avocado-cream, 20%);
.element {
color: $avocado-cream;
box-shadow: 0 0 0 2px rgba($avocado-cream, 0.35);
}