Home /Compare /Firebrick vs Ruby

Firebrick vs Ruby: What's the Difference?

The main difference between Firebrick and Ruby is hue — Firebrick is a warm red, while Ruby is a warm pink. Firebrick (#B22222) has an HSL of 0°, 68%, 42%, whereas Ruby (#E0115F) sits at 337°, 86%, 47%.

Firebrick#B22222
Ruby#E0115F
#B22222Blended: #C91A41#E0115F
ShareSave to PinterestTweet

Firebrick vs Ruby: Key Differences at a Glance

Aspect Firebrick Ruby
BrightnessMedium (L=42%) — balanced, versatileMedium (L=47%) — balanced, versatile
SaturationModerately saturated (S=68%) — balanced in intensityVivid (S=86%) — bright, energetic, eye-catching
Hue familyRedPink
TemperatureWarmWarm
Hex code#B22222#E0115F
RGB178, 34, 34224, 17, 95

Can you use Firebrick and Ruby together?

Ruby text on Firebrick
Firebrick text on Ruby
Contrast Ratio:1.40:1Insufficient Contrast

How to Tell Firebrick and Ruby Apart

  • ●Check saturation: Ruby looks more vivid and saturated.
  • ●Watch the undertone: the hue shifts 337° between them, which changes the perceived temperature.
  • ●Compare them on a white background to see true saturation, and on black to see true lightness.

Firebrick or Ruby: Which to Use and Where

Four real design scenarios, with the recommended pick based on hue, saturation, and WCAG contrast.

◆Branding & logos
PickRuby

Ruby is more saturated (86% HSL vs 68%) so it reads as bolder and more memorable at logo scale, while Firebrick can feel washed out when printed small.

▢Web UI & body text backgrounds
PickFirebrick

Firebrick hits a 6.68:1 WCAG contrast against white — safer for text-heavy interfaces — where Ruby only reaches 4.76:1 and risks failing AA at small body sizes.

⬡Fashion & apparel
PickRuby

Ruby is a warm tone that flatters spring/summer collections and warmer skin undertones, while Firebrick leans warmer and is better suited to autumn/winter layering.

▣Interior design & walls
PickFirebrick

Firebrick is the more muted of the two (68% saturation) and sits more calmly on large wall surfaces, while Ruby's higher chroma can overwhelm a room when used beyond accent pieces.

When to Use Firebrick vs Ruby in Design

Use Firebrick for:
●Alerts, errors, stop states
●Sale & promotion banners
●Food and beverage packaging
●Sports and energy branding
●Romantic & bold fashion
Use Ruby for:
●Soft feminine branding
●Beauty, skincare, romance
●Valentine's and weddings
●Youthful and playful design
●Gentle friendly UI accents

Firebrick and Ruby Hex Codes, RGB & HSL

Firebrick#B22222

Firebrick (#B22222) is a medium, moderately saturated red with a warm undertone — it feels balanced, versatile and balanced in intensity.

HEX
RGB
HSL
HSV
CMYK
PANTONE
Shades
Tints
Ruby#E0115F

Ruby (#E0115F) is a medium, vivid pink with a warm undertone — it feels balanced, versatile and bright, energetic, eye-catching.

HEX
RGB
HSL
HSV
CMYK
PANTONE
Shades
Tints

Firebrick and Ruby WCAG Contrast Ratios

Text legibility depends on the contrast ratio between foreground and background. WCAG 2.1 AA requires at least 4.5:1 for normal text and 3:1 for large text; AAA requires 7:1. Use these numbers to choose accessible combinations for your design.

Sample text preview
Firebrick text on white
6.68:1AA
Sample text preview
Firebrick text on black
3.14:1AA Large
Sample text preview
Ruby text on white
4.76:1AA
Sample text preview
Ruby text on black
4.41:1AA Large
Sample text preview
Firebrick text on Ruby
1.4:1Fail
Sample text preview
Ruby text on Firebrick
1.4:1Fail

Explore Firebrick and Ruby individually

Each color has a dedicated page with shades, tints, CSS name, pairings, and color psychology.

Firebrick color page#B22222 · shades, tints, pairingsRuby color page#E0115F · shades, tints, pairings

More Firebrick and Ruby Comparisons

FirebrickvsWineRedvsRubyRubyvsWineFirebrickvsGreyRubyvsGreyFirebrickvsGarnetRubyvsBrickFirebrickvsScarletBrownvsRubyFirebrickvsEspressoRubyvsGarnetTomatovsRuby

Firebrick vs Ruby FAQ

What is the difference between firebrick and ruby?+
The main difference between Firebrick and Ruby is hue — Firebrick is a warm red, while Ruby is a warm pink. Firebrick (#B22222) has an HSL of 0°, 68%, 42%, whereas Ruby (#E0115F) sits at 337°, 86%, 47%.
Is firebrick darker than ruby?+
Yes. Firebrick is darker, with a lightness of 42% in HSL compared to Ruby at 47% — a 5-point gap.
Are firebrick and ruby the same color?+
No. Firebrick is #B22222 and Ruby is #E0115F. They differ by 23° in hue, 5% in lightness, and 18% in saturation.
Which is more saturated, firebrick or ruby?+
Ruby is more saturated. In HSL, Firebrick has 68% saturation and Ruby has 86% — Ruby is the more vivid of the two, while Firebrick reads as more muted.
Is firebrick warm or cool?+
Firebrick (#B22222) is a warm red. Its hue sits at 0° on the color wheel, which places it in the warm range.
Is ruby warm or cool?+
Ruby (#E0115F) is a warm pink. Its hue sits at 337° on the color wheel, which places it in the warm range.
Can you use firebrick and ruby together?+
Yes. Firebrick (red) and Ruby (pink) can work as a complementary or analogous pair. Use one as the dominant tone and the other as a 10–20% accent to keep the palette balanced.
What color family does firebrick belong to?+
Firebrick belongs to the red family. Its HSL is 0°, 68%, 42% — a warm tone within the broader red group.
What is the hex code for firebrick?+
The hex code for Firebrick is #B22222. In RGB, that's rgb(178, 34, 34), and in HSL it's hsl(0, 68%, 42%).
What is the hex code for ruby?+
The hex code for Ruby is #E0115F. In RGB, that's rgb(224, 17, 95), and in HSL it's hsl(337, 86%, 47%).