Named color · #4E4F48
Aceto Balsamico
Aceto Balsamico is #4E4F48: rgb(78 79 72), hsl(69 5% 30%), oklch(0.424 0.011 113.5). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Gray mean? → · Aceto Balsamico color name →
#4E4F48
oklch(0.424 0.011 113.5)
Color conversions
- HEX
- #4e4f48
- RGB
- rgb(78 79 72)
- HSL
- hsl(69 5% 30%)
- HWB
- hwb(69 28% 69%)
- OKLCH
- oklch(0.424 0.011 113.5)
- OKLab
- oklab(0.424 -0.005 0.01)
- CIE Lab
- lab(33.34 -1.52 4)
- LCH
- lch(33.34 4.28 110.7)
- CMYK
- cmyk(1% 0% 9% 69%)
Tints · Shades · Tones
Tints
- 5E5F58
- 6E6F69
- 7F807B
- 90918C
- A2A39F
- B4B4B1
- C6C7C4
- D9D9D7
- ECECEB
Shades
- 43443D
- 383833
- 2D2E29
- 23231F
- 191916
- 0F100D
- 070706
- 020202
- 000000
Tones
- 53544D
- 585853
- 5D5D58
- 61625E
- 666763
- 6B6C69
- 71716F
- 767674
- 7B7B7A
Color harmonies
Complementary +180°
- 4E4F48
Aceto Balsamico
- 4E4D54
≈ Blackened Pearl
Analogous -30° +30°
- 4E4F48
Aceto Balsamico
- 514E47
≈ Renwick Brown
- 4B504A
≈ Iron River
Triadic +120° +240°
- 4E4F48
Aceto Balsamico
- 484F54
≈ Lamp Post
- 544C4F
≈ Subtle Night Sky
Split-complementary +150° +210°
- 4E4F48
Aceto Balsamico
- 4B4E55
≈ Poppy Seed
- 514C52
≈ Blackened Pearl
Tetradic +90° +180° +270°
- 4E4F48
Aceto Balsamico
- 475051
≈ Blindfold
- 4E4D54
≈ Blackened Pearl
- 544C4B
≈ Off the Beaten Path
Contrast & accessibility
Ag
AAAOn white
WCAG 8.28:1 · APCA Lc 89
Ag
FailOn black
WCAG 2.53:1 · APCA Lc 14
Best text color: #FFFFFF
WCAG 8.28:1 (AAA) · APCA Lc 89
Contrast pairs
Code snippets
CSS
:root {
--aceto-balsamico: #4e4f48;
--aceto-balsamico-rgb: 78 79 72;
--aceto-balsamico-oklch: oklch(0.424 0.011 113.5);
}
.element {
color: var(--aceto-balsamico);
background-color: hsl(69 5% 30%);
border-color: oklch(0.424 0.011 113.5);
}Tailwind CSS v4
@theme {
--color-aceto-balsamico: #4e4f48;
--color-aceto-balsamico-50: #f5f5f2;
--color-aceto-balsamico-100: #e7e8e4;
--color-aceto-balsamico-200: #d4d5cf;
--color-aceto-balsamico-300: #b7b8b2;
--color-aceto-balsamico-400: #9e9f98;
--color-aceto-balsamico-500: #86877f;
--color-aceto-balsamico-600: #71726b;
--color-aceto-balsamico-700: #5b5b56;
--color-aceto-balsamico-800: #42433e;
--color-aceto-balsamico-900: #2e2e2b;
--color-aceto-balsamico-950: #1b1b18;
}SCSS
$aceto-balsamico: #4e4f48;
$aceto-balsamico-rgb: 78, 79, 72;
$aceto-balsamico-light: mix(#fff, $aceto-balsamico, 20%);
$aceto-balsamico-dark: mix(#000, $aceto-balsamico, 20%);
.element {
color: $aceto-balsamico;
box-shadow: 0 0 0 2px rgba($aceto-balsamico, 0.35);
}