Blood Orange

Meet Blood Orange (#D1001C), a fiery red that stops just short of pure crimson. Its intense saturation and subtle orange undertone create a uniquely vibrant hue that immediately draws the eye, making it a powerful choice for any designer's palette.

Blood Orange
#D1001C
Copy
Copied
Access our full UI & UX library today.
Join for free

What color is Blood Orange?

Blood Orange is a deep, saturated red with a distinct orange influence, giving it a fiery and energetic character.

The color #D1001C is intensely warm, with no cool undertones, creating a vibrant and almost glowing appearance.

What is the meaning of Blood Orange (#D1001C) in design?

Blood Orange combines the energetic zest of orange with the passionate intensity of red.

It's a color of bold confidence and creative fervor, making a statement that is both sophisticated and full of life.

How do I use Blood Orange in UI design?

Blood Orange, with its intense #D1001C value, works powerfully as an accent color. Use it for critical interface elements like call-to-action buttons or notifications to command user attention. For pairings, consider setting it against deep charcoals or stark off-whites for maximum contrast. Alternatively, a split-complementary palette with shades of teal and navy can produce a vibrant, modern composition.

Brands like Uxcel, Gmail, and ESPN use similar high-energy reds to draw the eye to primary actions and key branding moments. The color is often reserved for elements that require immediate focus, making its application a deliberate choice rather than a dominant background.

Use the tools below to explore curated palettes, test color contrast for accessibility, and preview Blood Orange in real UI components from top brands.

Using Blood Orange color codes

The most direct way to use Blood Orange in a digital project is with its hex code, #D1001C. This six-digit value is the standard for web development, but it's just one of many ways to define a color.

For different media, you'll need to translate that hex value. RGB codes are for screen-based work as they define color with light, whereas CMYK values are required for anything destined for print. Other models, like HSL, provide a more intuitive way to make adjustments.

To get you started, we’ve converted Blood Orange (#D1001C) into a range of popular formats below. Simply find the code you need and copy it for your project.

Blood Orange Code Conversions

HEX
#D1001C
Copy
Copied
LAB
34.74, -20.85, 14.42
Copy
Copied
RGB
53, 90, 58
Copy
Copied
XYZ
5.89, 8.37, 5.31
Copy
Copied
HSL
128°, 26%, 28%
Copy
Copied
LCH
34.74, 25.35, 145.33°
Copy
Copied
HSB
128°, 41%, 35%
Copy
Copied
LUV
34.74, -7.15, 19.17
Copy
Copied
CMYK
41%, 0%, 36%, 65%
Copy
Copied
HWB
128°, 21%, 65%
Copy
Copied

Blood Orange Color Harmonies

Analogous

Analogous color schemes use colors adjacent on the color wheel. When built around Blood Orange, they produce a cohesive and naturally serene visual effect.

#123456
#123456
#123456

Complementary

Complementary colors are opposites on the color wheel. When paired with Blood Orange, these hues create a striking, high-contrast visual effect.

#123456
#123456

Split Complementary

A split complementary scheme for Blood Orange uses the two colors adjacent to its direct complement, offering a vibrant yet balanced high-contrast palette.

#123456
#123456
#123456

Triadic

Triadic colors form a triangle on the color wheel. With Blood Orange as a base, this combination offers a bold, multicolored effect with strong visual contrast.

#123456
#123456
#123456

Tetradic

Using Blood Orange as a base, a tetradic scheme adds three more colors, forming two complementary pairs for a bold yet harmonious combination.

#123456
#123456
#123456
#123456

Square

Based on four colors evenly spaced around the color wheel, a square scheme offers a rich, high-contrast palette built around Blood Orange.

#123456
#123456
#123456
#123456

Blood Orange Color Variations

Shades

Shades of Blood Orange are darker tones created by adding black for a weightier feel.

#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied

Tints

Tints of Blood Orange are created by adding white, resulting in lighter, softer hues.

#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied

Tones

Tones of Blood Orange are created by adding gray, resulting in softer, more muted versions.

#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied

Hues

Hues are variations of Blood Orange, sharing its base but with different intensities or temperatures.

#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied

What Interfaces Use Colors Like Blood Orange?

No items found.
Keep the inspiration going with Mobbin
Join for free
No items found.

Never run out of inspiration again.

Use Mobbin for free as long as you like or get full access with any of our paid plans.

Brand Logo Image
Coinbase
Brand Logo Image
Wise
Brand Logo Image
Headspace
Brand Logo Image
Airbnb
Brand Logo Image
Uber
Brand Logo Image
Nike
Brand Logo Image
Pinterest
Brand Logo Image
Coinbase
Brand Logo Image
Wise
Brand Logo Image
Headspace
Brand Logo Image
Airbnb
Brand Logo Image
Uber
Brand Logo Image
Nike
Brand Logo Image
Pinterest
Brand Logo Image
Coinbase
Brand Logo Image
Wise
Brand Logo Image
Headspace
Brand Logo Image
Airbnb
Brand Logo Image
Uber
Nike
Brand Logo Image
Pinterest
Logo Image
Coinbase
Wise Logo Image
Wise
Headspace Logo Image
Headspace
Airbnb Logo Image
Airbnb
Brand Logo Image
Uber
Brand Logo Image
Nike
Brand Logo Image
Pinterest
Brand Logo Image
Coinbase
Brand Logo Image
Wise
Brand Logo Image
Headspace
Brand Logo Image
Airbnb
Brand Logo Image
Uber
Brand Logo Image
Nike
Brand Logo Image
Pinterest
Brand Logo Image
Coinbase
Brand Logo Image
Wise
Brand Logo Image
Headspace
Brand Logo Image
Airbnb
Brand Logo Image
Uber
Brand Logo Image
Nike
Brand Logo Image
Pinterest
Brand Logo Image
Mailchimp
Brand Logo Image
Twitch
Brand Logo Image
Chatgpt
Brand Logo Image
Klarna
Brand Logo Image
Loom
Brand Logo Image
Creme
Brand Logo Image
Mailchimp
Brand Logo Image
Twitch
Brand Logo Image
Chatgpt
Brand Logo Image
Klarna
Brand Logo Image
Loom
Brand Logo Image
Creme
Brand Logo Image
Mailchimp
Brand Logo Image
Twitch
Brand Logo Image
Chatgpt
Brand Logo Image
Klarna
Brand Logo Image
Loom
Brand Logo Image
Creme
Brand Logo Image
Mailchimp
Brand Logo Image
Twitch
Brand Logo Image
Chatgpt
Brand Logo Image
Klarna
Brand Logo Image
Loom
Brand Logo Image
Creme
Brand Logo Image
Mailchimp
Brand Logo Image
Twitch
Brand Logo Image
Chatgpt
Brand Logo Image
Klarna
Brand Logo Image
Loom
Brand Logo Image
Creme
Brand Logo Image
Mailchimp
Brand Logo Image
Twitch
Brand Logo Image
Chatgpt
Brand Logo Image
Klarna
Brand Logo Image
Loom
Brand Logo Image
Creme
Brand Logo Image
Dropbox
Brand Logo Image
Spotify
Brand Logo Image
Apple TV
Brand Logo Image
Shop
Brand Logo Image
Cosmos
Brand Logo Image
Retro
Brand Logo Image
Notion
Brand Logo Image
Dropbox
Brand Logo Image
Spotify
Brand Logo Image
Apple TV
Brand Logo Image
Shop
Brand Logo Image
Cosmos
Brand Logo Image
Retro
Brand Logo Image
Notion
Brand Logo Image
Dropbox
Brand Logo Image
Spotify
Brand Logo Image
Apple TV
Brand Logo Image
Shop
Brand Logo Image
Cosmos
Brand Logo Image
Retro
Brand Logo Image
Notion
Brand Logo Image
Dropbox
Brand Logo Image
Spotify
Brand Logo Image
Apple TV
Brand Logo Image
Shop
Brand Logo Image
Cosmos
Brand Logo Image
Retro
Brand Logo Image
Notion
Brand Logo Image
Dropbox
Brand Logo Image
Spotify
Brand Logo Image
Apple TV
Brand Logo Image
Shop
Brand Logo Image
Cosmos
Brand Logo Image
Retro
Brand Logo Image
Notion
Brand Logo Image
Dropbox
Brand Logo Image
Spotify
Brand Logo Image
Apple TV
Brand Logo Image
Shop
Brand Logo Image
Cosmos
Brand Logo Image
Retro
Brand Logo Image
Notion