Figma color wheel
Want to find the perfect complementary or analogous colors to match slate?
Skip to main content
Everything you need to know about brass to inspire your next design.
Brass is a rich, warm color that deeply resonates with tones of yellow and brown. As a metallic shade, it sits between gold and bronze on the color wheel, echoing the golden hues of the brass alloy. Its dominant yellow-brown tone is highlighted with soft, natural gleams, making it appear both vintage and timeless. This complex color offers both depth and radiance, reflecting the warmth and sturdiness of its namesake metal. With a sense of antiquity and durability, brass is often associated with sophistication and elegance, infusing designs with a hint of nostalgia and a dash of refinement. The beauty of brass lies in its versatility, striking a perfect balance between the past and the present, making it an ideal choice for a range of aesthetic contexts.
Shades
Tints
Tones
Hues
Complementary
Split
Monochromatic
Analogous
Triadic
Square
Golden Harvest
Ocean Sunrise
Autumn Canopy
Brass is defined by the following color codes and values to ensure consistency across various digital platforms and devices.
Accessibility considerations play a crucial role in UX and UI design color choices. Figma offers plugins in the Community to make sure your designs meet Web Content Accessibility Guidelines.
For variations within the same spectrum as brass, consider:
To complement Brass, consider pairing it with:
While brass is known for its warm metal color, it may clash with:
Contrast 2.47
#B5A642
How you design, align, and build matters. Do it together with Figma.
| Category | ||
|---|---|---|
Fail | Fail | |
Fail | Fail | |
Fail | Fail |
Contrast 8.5
#B5A642
How you design, align, and build matters. Do it together with Figma.
| Category | ||
|---|---|---|
Pass | Pass | |
Pass | Pass | |
Pass | Pass |
Protanopia
Deuteranopia
Tritanopia
Achromatopsia
The hexadecimal color #6D8196, known as slate, has RGB values of R:109, G:129, B:150 and CMYK values of C:0.27, M:0.14, Y:0, K:0.41.
| VALUE | CSS | |
|---|---|---|
| HEX | B5A642 | #B5A642 |
| RGB DECIMAL | ( 181, 166, 66) | rgb(181, 166, 66) |
| RGB PERCENTAGE | 71%, 65%, 26% | rgb(71%, 65%, 26%) |
| CMYK | 13, 8, 63, 29 | |
| HSL | 114°, 53%, 48% | hsl(114°, 53%, 48%) |
| HSV (OR HSB) | 114°, 63%, 71% | |
| WEB SAFE | 999933 | #999933 |
| CIE-LAB | 157, 147, 56 | |
| XYZ | 67.25, 62.596, 12.745 | |
| xyY | 0.408, 0.413, 62.596 | |
| CIE-LCH | 114°, 49.327, 63.716 | |
| CIE-LUV | 144.151, 17.448, 49.76 | |
| HUNTER-LAB | 85.159, 0.968, 37.529 | |
| BINARY | 10110101, 10100110, 01000010 | |
| iOS - SwiftUI | Color(0.71, 0.65, 0.26) | |
| iOS - UIKit | UIColor(red: 0.71, green: 0.65, blue: 0.26, alpha: 1.0) | |
| Android - Compose | Color(0xFFB5A642) |
Want to find the perfect complementary or analogous colors to match slate?
Learn more about aubergine.
Learn about the color yellow