Gunmetal Gray (#2C3539) — Color Codes, Meaning & UI Palettes
Gunmetal Gray (#2C3539) is a dark, lustrous gray infused with subtle metallic blue undertones, named after the heavy bronze-tin-zinc alloy used in industrial engineering. It denotes rugged durability, stealth, and high-performance engineering.
#2C3539. In RGB, it is rgb(44, 53, 57). In HSL, it is hsl(198deg, 13%, 20%), and its print CMYK formulation is cmyk(23%, 7%, 0%, 78%). It has a relative luminance of 0.034 and pairs best in UI design with Terminal Cyan (#38BDF8) and Pure White (#FFFFFF).
WCAG 2.1 Accessibility & Contrast Rating
11-Step Tints & Shades Scale (Tailwind 50–950)
Mathematically balanced luminance scale for design tokens and CSS color palettes. Click any shade to copy hex code:
Color Harmonies & Palette Schemes
Complementary
Analogous -30°
Analogous +30°
Triadic +120°
Triadic +240°
Curated UI Design Pairings for Gunmetal Gray
Superior dark mode background and sidebar color for developer consoles, automotive dashboards, cryptocurrency terminals, and hardware tools.
Export Gunmetal Gray Code Snippets
--color-gunmetal-gray: #2C3539;
'gunmetal-gray': '#2C3539'
Color(hex: "#2C3539")
{"name": "Gunmetal Gray", "hex": "#2C3539"}
Frequently Asked Questions About Gunmetal Gray (#2C3539)
What is the exact HEX code for Gunmetal Gray?
The exact HEX code for Gunmetal Gray is #2C3539. In 8-digit hexadecimal (with 100% opacity), it is #2C3539FF. Its RGB decimal equivalent is rgb(44, 53, 57) and its HSL value is hsl(198deg, 13%, 20%).
What colors go best with Gunmetal Gray in UI and web design?
Gunmetal Gray pairs exceptionally well with Terminal Cyan (#38BDF8), Pure White (#FFFFFF), Electric Violet (#8B5CF6), and Subtle Border (#374151).
How do I use Gunmetal Gray in CSS and Tailwind CSS?
In standard CSS, apply it directly via color: #2C3539; or background-color: #2C3539;. In Tailwind CSS, use arbitrary value syntax like bg-[#2c3539] or text-[#2c3539], or define it in your Tailwind v4 @theme block as --color-gunmetal-gray: #2C3539;.
Is Gunmetal Gray WCAG accessible for readable text?
Against a pure white background (#FFFFFF), Gunmetal Gray achieves a contrast ratio of 12.5:1 (AAA). Against a pure black background (#000000), it achieves 1.68:1 (Fail). Check custom contrast pairings on Pikka's WCAG Contrast Checker.
Explore More Colors in the Dictionary
Browse our complete catalog of curated named colors, harmonic palettes, and accessible UI combinations.