Sunset Orange is a vibrant, warm hue, blending red and orange on the color wheel, evoking sunset vibes. It's an eye-catching reddish orange, rich with autumn shades and warm undertones. This bold color works well to create inviting, energetic designs with lively citrus tones.
Sunset Orange is defined by the following color codes and values to ensure consistency across various digital platforms and devices.
- Hex Code: #FD5E53
- RGB value: 99.2% red, 36.9% green, 32.5% 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 sunset orange, consider:
- Red-Orange (#ff4b33): Red-Orange shares the lively and vibrant tones of Sunset Orange, with its strong reddish undertone adding to the warmth.
- Cinnabar (#e84b3d): Cinnabar bears a resemblance to Sunset Orange through its bold, eye-catching hue, featuring a reddish tint that enriches its vividness.
- Vermilion (#e73121): Vermilion resonates with Sunset Orange's dynamic presence, blending warm undertones with a slightly more intense red characteristic.
- Coral (#ff8559): Coral captures a softer, yet equally vibrant warmth akin to Sunset Orange, with its reddish-orange hues adding a cheerful citrus tone to any setting.
To complement Sunset Orange, consider pairing it with:
- Seafoam (#8DDCDC): This calming, muted green complements the warm, citrus tones of Sunset Orange, creating a vibrant yet serene palette suitable for both digital designs and interior spaces.
- Powder Blue (#B8E3E9): Its cool, subtle hue balances the warmth of Sunset Orange, offering a harmonious contrast that enhances the overall visual interest.
- Eggplant (#614051): This deep, rich purple adds depth and sophistication to Sunset Orange's vibrant tones, creating an unexpected yet striking pairing.
- Mint Green (#ADEBB3): This fresh, light color introduces a crisp contrast that elevates the warm undertones of Sunset Orange, making for an eye-catching color palette.
- Slate Gray (#6D8196): It provides a neutral, grounding effect that allows Sunset Orange to take center stage, while adding a touch of elegance to the overall scheme.
While Sunset Orange is a vibrant tone bursting with energy, it may clash with:
- Bordeaux (#7B1B38): The deep, moody hue of Bordeaux contrasts sharply with the lively nature of Sunset Orange, potentially creating a discordant color palette.
- Lime Green (#89F336): This bright, bold color can be overwhelming next to the warm, reddish orange, competing for attention rather than complementing it.
- Fuchsia (#FF00FF): The intense saturation of Fuchsia creates a visual tension with Sunset Orange, leading to a clashing combination.
- Cyan (#00FFFF): The high contrast between the cool, vivid shade of Cyan and the warm tones of Sunset Orange may result in a harsh and visually jarring effect.
- Navy Blue (#000080): The dark, heavy nature of Navy Blue can overpower the lighter vibrancy of Sunset Orange, leading to a mismatched pairing when used in a color palette.
Color variations
Shades
Tints
Tones
Hues
Color harmonies
Complementary
Split
Monochromatic
Analogous
Triadic
Square
Custom palettes
Spice Drift
Coral Frost
Fiery Lime
Contrast checker
Contrast 3.04
- Large Text
#FD5E53
- Normal Text
How you design, align, and build matters. Do it together with Figma.
| Category | ||
|---|---|---|
Fail | Fail | |
Pass | Fail | |
Pass | Fail |
Contrast 6.9
- Large Text
#FD5E53
- Normal Text
How you design, align, and build matters. Do it together with Figma.
| Category | ||
|---|---|---|
Pass | Fail | |
Pass | Pass | |
Pass | Pass |
Color simulations
Protanopia
Deuteranopia
Tritanopia
Achromatopsia
The hexadecimal color #FD5E53, known as Sunset Orange, has RGB values of R:253, G:94, B:83 and CMYK values of C:0, M:63, Y:67, K:1.
| VALUE | CSS | |
|---|---|---|
| HEX | #FD5E53 | #FD5E53 |
| RGB DECIMAL | 253, 94, 83 | RGB(253,94,83) |
| RGB PERCENTAGE | 99.2, 36.9, 32.5 | RGB(99.2%,36.9%,32.5%) |
| CMYK | 0, 63, 67, 1 | |
| HSL | HSL(3.9, 97.7%, 65.9%) | HSL(3.9, 97.7%, 65.9%) |
| HSV (OR HSB) | 3.9°, 67.2, 99.2 | |
| WEB SAFE | #255102102 | #255102102 |
| BINARY | 11111101, 01011110, 01010011 | |
| iOS - SwiftUI | Color(red: 0.992, green: 0.369, blue: 0.325) | |
| iOS - UIKit | UIColor(red: 0.992, green: 0.369, blue: 0.325, alpha: 1) | |
| Android - Compose | Color(0xFFFD5E53) |
