Figma color wheel
Want to find the perfect complementary or analogous colors to match Fawn?
Fawn is a gentle, calming shade that blends tan and light brown. It's positioned between beige and brown on the color wheel, giving it a warm, earthy feel. Related shades include taupe and camel. Use it in designs for a soft, natural touch that adds warmth and subtle sophistication.
Color variations
Shades
Tints
Tones
Hues
Color harmonies
Complementary
Split
Monochromatic
Analogous
Triadic
Square
Custom palettes
Coral Majesty
Cider Wave
Amber Carnival
Fawn is defined by the following color codes and values to ensure consistency across various digital platforms and devices.
- Hex Code: #E5AA70
- RGB value: 89.8% red, 66.7% green, 43.9% blue
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 Fawn, consider:
- Beige (#ede8d0): Offers a sandy and soft tone with a warm undertone that makes it reminiscent of Fawn's earthy vibes.
- Sand (#cbbd93): Captures the soft and muted quality of beach sand, aligning with the warm neutrality found in Fawn.
- Khaki (#d5c58a): Resembles Fawn with its subdued and earthy hue, evoking a sense of natural balance and calm.
- Tan (#d6b588): Shares Fawn's light brown components, representing a warm, understated, and natural aesthetic.
To complement Fawn, consider pairing it with:
- Slate Gray (#6d8196): This versatile shade provides a cool, calming backdrop that contrasts beautifully with Fawn's warm tones, adding depth to your palette.
- Dusty Rose (#dca1a1): With its soft, muted pink hue, Dusty Rose enhances the gentle warmth of Fawn, creating a harmonious and elegant pairing.
- Turquoise (#40e0d0): This vibrant blue-green adds a refreshing splash of color that livens up Fawn's subtle earthiness, resulting in a dynamic yet balanced combination.
- Ivory (#ffffe3): The creamy lightness of Ivory offers a neutral complement, allowing Fawn's natural warmth to take center stage without overpowering the design.
- Olive Green (#636b2f): Olive Green introduces an earthy, rustic vibe that pairs seamlessly with Fawn, emphasizing a natural and grounded aesthetic.
While Fawn is a gentle earthy tone, it may clash with:
- Neon Green (#2CFF05): Neon green’s intense brightness can overshadow Fawn’s subtlety, creating a clash of vibrancy that feels unbalanced.
- Cinnabar (#E84B3D): Cinnabar’s bold, warm tone can conflict with the soft neutrality of Fawn, leading to a visually harsh contrast.
- Vermilion (#E73121): Vermilion’s vivid, fiery hue competes with Fawn, resulting in a pairing that feels too strong and disconnected.
- Bright Yellow (#FFED29): Bright yellow’s high energy can overwhelm Fawn’s muted nature, making it appear dull in comparison.
- Magenta (#FD3DB5): Magenta’s striking saturation may overpower Fawn’s calm presence, resulting in a jarring visual experience.
Contrast checker
Contrast 2.04
- Large Text
#E5AA70
- Normal Text
How you design, align, and build matters. Do it together with Figma.
| Category | ||
|---|---|---|
Fail | Fail | |
Fail | Fail | |
Fail | Fail |
Contrast 10.32
- Large Text
#E5AA70
- Normal Text
How you design, align, and build matters. Do it together with Figma.
| Category | ||
|---|---|---|
Pass | Pass | |
Pass | Pass | |
Pass | Pass |
Color simulations
Protanopia
Deuteranopia
Tritanopia
Achromatopsia
The hexadecimal color #E5AA70, known as Fawn, has RGB values of R:229, G:170, B:112 and CMYK values of C:0, M:26, Y:51, K:10.
| VALUE | CSS | |
|---|---|---|
| HEX | #E5AA70 | #E5AA70 |
| RGB DECIMAL | 229, 170, 112 | RGB(229,170,112) |
| RGB PERCENTAGE | 89.8, 66.7, 43.9 | RGB(89.8%,66.7%,43.9%) |
| CMYK | 0, 26, 51, 10 | |
| HSL | HSL(29.7, 69.2%, 66.9%) | HSL(29.7, 69.2%, 66.9%) |
| HSV (OR HSB) | 29.7°, 51.1, 89.8 | |
| WEB SAFE | #204153102 | #204153102 |
| BINARY | 11100101, 10101010, 01110000 | |
| iOS - SwiftUI | Color(red: 0.898, green: 0.667, blue: 0.439) | |
| iOS - UIKit | UIColor(red: 0.898, green: 0.667, blue: 0.439, alpha: 1) | |
| Android - Compose | Color(0xFFE5AA70) |
