Named color · #373332
Gondola
Gondola is #373332: rgb(55 51 50), hsl(12 5% 21%), oklch(0.325 0.006 34.3). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Gray mean? → · Gondola color name →
#373332
oklch(0.325 0.006 34.3)
Color conversions
- HEX
- #373332
- RGB
- rgb(55 51 50)
- HSL
- hsl(12 5% 21%)
- HWB
- hwb(12 20% 78%)
- OKLCH
- oklch(0.325 0.006 34.3)
- OKLab
- oklab(0.325 0.005 0.003)
- CIE Lab
- lab(21.64 1.67 1.31)
- LCH
- lch(21.64 2.12 38)
- CMYK
- cmyk(0% 7% 9% 78%)
Tints · Shades · Tones
Tints
- 484544
- 5B5756
- 6D6A69
- 817E7D
- 959292
- A9A7A7
- BEBCBC
- D3D2D2
- E9E8E8
Shades
- 2E2B2A
- 262322
- 1E1C1B
- 161414
- 0F0D0D
- 080707
- 030303
- 010101
- 000000
Tones
- 3E3A39
- 454141
- 4C4948
- 535050
- 5A5857
- 62605F
- 696867
- 71706F
- 787878
Color harmonies
Complementary +180°
- 373332
Gondola
- 313536
≈ Phantom Ship
Analogous -30° +30°
- 373332
Gondola
- 373334
≈ Gondola
- 363331
≈ Sinister Minister
Triadic +120° +240°
- 373332
Gondola
- 323533
≈ Jet
- 333437
≈ Dark Kettle Black
Split-complementary +150° +210°
- 373332
Gondola
- 313534
≈ Phantom Ship
- 323437
≈ Ebony Clay
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
AAAOn white
WCAG 12.48:1 · APCA Lc 98
Ag
FailOn black
WCAG 1.68:1 · APCA Lc 0
Best text color: #FFFFFF
WCAG 12.48:1 (AAA) · APCA Lc 98
Contrast pairs
Code snippets
CSS
:root {
--gondola: #373332;
--gondola-rgb: 55 51 50;
--gondola-oklch: oklch(0.325 0.006 34.3);
}
.element {
color: var(--gondola);
background-color: hsl(12 5% 21%);
border-color: oklch(0.325 0.006 34.3);
}Tailwind CSS v4
@theme {
--color-gondola: #373332;
--color-gondola-50: #f7f4f4;
--color-gondola-100: #eae7e6;
--color-gondola-200: #d7d3d2;
--color-gondola-300: #bab6b5;
--color-gondola-400: #a29d9c;
--color-gondola-500: #8a8583;
--color-gondola-600: #75706f;
--color-gondola-700: #5d5a59;
--color-gondola-800: #444241;
--color-gondola-900: #2f2d2d;
--color-gondola-950: #1c1a1a;
}SCSS
$gondola: #373332;
$gondola-rgb: 55, 51, 50;
$gondola-light: mix(#fff, $gondola, 20%);
$gondola-dark: mix(#000, $gondola, 20%);
.element {
color: $gondola;
box-shadow: 0 0 0 2px rgba($gondola, 0.35);
}