Skip to main content

Light orange

Everything you need to know about light orange to inspire your next design.

Get color palette

Pick a color

Hex

RGB

HSB

HSL

Pick palette settings

Custom palettes

Light orange is a cheerful and vibrant color that exudes playfulness and optimism. Positioned between yellow and red on the color wheel, this warm and inviting hue encompasses a spectrum of shades, from the softness of peach to the brightness of cantaloupe.

light orangelight orange

Light orange is defined by the following color codes and values to ensure consistency across various digital platforms and devices.

- HEX code: #FFDBBB

- RGB value: 100% red, 85.9% green and 73.3% 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.

If you're looking to add a touch of light orange to your project, here are some ways to do it:

  • Highlight key elements. Use light orange to highlight calls to action, buttons, or important information without overwhelming the user.
  • Create warmth and energy. Incorporate light orange in your designs to introduce warmth and a sense of energy, making digital spaces feel more inviting and dynamic.
  • Balance with neutrals. Pair light orange with neutral colors to balance its warmth and ensure your design doesn't feel too saturated or intense.
  • Use for social apps. Given its association with communication and sociability, light orange is especially effective in designs for social networking apps and platforms emphasizing user interaction.

Keep in mind that color and its meaning can change from culture to culture—and at any given time. If you are designing for a global audience, research color considerations for your specific regions.

For variations within the same soft and warm spectrum as light orange, consider the following:

  • Peach (#FFD3AC)) resembles light orange with its blend of pink and yellow tones, offering a slightly softer, creamier look that evokes warmth and comfort.
  • Apricot (#FBCEB1) shares light orange's gentle warmth but with a hint more pink, creating a delicate and inviting, equally soothing hue.
  • Salmon (#FA8072) introduces a bit more pink, providing a vibrant yet soft alternative bridging the gap between orange and pink tones.
  • Champagne (#F7E6CA) is lighter and more neutral, retaining the warmth of light orange while leaning towards a more subdued elegance.

To complement light orange's delicate tones, consider pairing it with:

  • Cool gray (#CBCBCB) provides a modern, neutral background that allows the subtlety of light orange to shine, offering a sophisticated and balanced look.
  • Teal (#069494) introduces a rich, contrasting color that beautifully complements light orange with depth and vibrancy, enhancing the palette with a touch of elegance.
  • Lavender (#E6E6FA) adds a gentle, whimsical contrast, pairing sweetly with light orange for a soft, romantic vibe.
  • Olive green (#636B2F) offers an earthy, natural contrast, grounding the lightness of orange with its muted, deep green tones for a balanced, organic feel.
  • Navy blue (#000080) provides a classic, deep contrast that elevates light orange's brightness, creating a bold yet harmonious combination ideal for various settings.

Other colors worth considering include cream for a soft, cohesive look, dark chocolate brown for a rich, grounded contrast, and pale yellow for a cheerful, sunny complement.

Light orange may clash with:

  • Kelly green (#4CBB17) can be too vibrant, overshadowing the subtlety of light orange and creating a visually jarring effect.
  • Blue (#0000FF), with its intensity, might detract from light orange's soft warmth, leading to a stark and unharmonious contrast.
  • Neon pink (#FF00FF) offers a bold, vivid contrast that can overwhelm light orange's gentle hue, resulting in a palette that might feel too lively or discordant.
  • Dark purple (#800080), though rich and regal, can compete too much with light orange, overshadowing its softness and warmth.
  • Bright red (#FF0000) is a complementary color in theory, but its boldness can clash with light orange's muted elegance, creating a potentially overwhelming combination.

Light orange radiates warmth, happiness, and creativity. It retains the positive energy of orange but in a gentler, more approachable way. It can encourage social interaction and a sense of optimism.

In color psychology, people view light orange as revitalizing and uplifting. The gentle warmth of this hue encourages ease and comfort. Its ability to inspire happiness makes it perfect for environments designed for relaxation and enjoyment.

In UI design, light orange is a great choice for creating friendly and welcoming atmospheres. It can highlight important elements and calls to action without being overpowering.

Light orange doesn't have a documented history, but its parent color, orange, is rich. The use of orange hues traces back to ancient civilizations, where natural pigments were derived from minerals and plants to create vibrant shades for artwork and textiles. The 19th century's development of synthetic dyes further expanded the range of orange shades, including lighter tones like light orange.

Light orange gained popularity during the mid-century modern design movement in the 20th century. It was used in everything from furniture to graphic design, embodying the era's optimism and forward-thinking attitude. Light orange has often conveyed a retro yet contemporary aesthetic in recent years.

Color variations

Shades

Tints

Tones

Hues

Color harmonies

Complementary

Split

Monochromatic

Analogous

Triadic

Square

Custom palettes

Neutral Elegance

Peach Skyline

Subtle Blush

Contrast checker

Contrast 1.3

Large Text

#FFDBBB

Normal Text

How you design, align, and build matters. Do it together with Figma.

This is #FFDBBB text on a #FFFFFF background.
Category
Fail
Fail
Fail
Fail
Fail
Fail

Contrast 16.1

Large Text

#FFDBBB

Normal Text

How you design, align, and build matters. Do it together with Figma.

This is #FFDBBB text on a #000000 background.
Category
Pass
Pass
Pass
Pass
Pass
Pass

Color simulations

Protanopia

Deuteranopia

Tritanopia

Achromatopsia

The hexadecimal color #FFDBBB, known as light orange, has RGB values of R:255, G:219, B:187 and CMYK values of C:0, M:0.14, Y:0.27, K:0.

VALUECSS
HEXffdbbb#ffdbbb
RGB DECIMAL255, 219, 187rgb(255,219,187)
RGB PERCENTAGE100, 85.9, 73.3rgb(100%,85.9%,73.3%)
CMYK0, 14, 27, 0
HSL28.2°, 100, 86.7hsl(28.2,100%,86.7%)
HSV (OR HSB)28.2°, 26.7, 100
WEB SAFEffcccc#ffcccc
CIE-LAB89.633, 7.832, 20.366
XYZ75.54, 75.513, 57.607
xyY0.362, 0.362, 75.513
CIE-LCH89.633, 21.82, 68.966
CIE-LUV89.633, 24.412, 27.689
HUNTER-LAB86.898, 3.098, 21.524
BINARY11111111, 11011011, 10111011
iOS - SwiftUIColor(red: 255/255, green: 219/255, blue: 187/255)
iOS - UIKitUIColor(red: 255/255.0, green: 219/255.0, blue: 187/255.0, alpha: 1.0)
Android - ComposeColor(0xFFFFDBBB)