Use this color
Create with Ruby Red
Open a professional color tool with #9B111E already applied. Each configuration stays canonical to the tool and can be adjusted or shared.
CSS Utilities
--color-ruby-red: #9B111E;
.bg-ruby-red { background-color: #9B111E; }
.text-ruby-red { color: #9B111E; }Color history, meaning and use · Editorially reviewed
About Ruby Red Color
Ruby is the red variety of corundum. GIA explains that trace chromium creates the red color and can also produce fluorescence that intensifies its appearance. Natural rubies range from orangy red to purplish red, and small color differences can strongly affect how gems are classified and valued.
Ruby Red therefore works best as a gemstone-inspired family rather than a claim of exact mineral matching. In digital palettes it offers a dense, jewel-like accent suited to luxury, editorial, and ceremonial contexts. Dark surroundings can increase its visual drama, while warm white exposes whether the red leans toward orange or purple.
This HEX value is a practical digital reference; it cannot reproduce fluorescence, transparency, inclusions, cut, or lighting in a natural ruby.
WCAG Accessibility
Contrast checks for Ruby Red against black and white text.
Downloadable color reference infographic
Ruby Red Color Reference Infographic
Save a high-resolution infographic of Ruby Red, including its color values, coordinated palette, and black and white text contrast.

Color Harmonies
Variants
Pairings
Machine-readable data
Machine-Readable Color Data (JSON)
Perfect for CSS, design systems, automation, and AI ingestion.
hexCanonical HEX valuergbRed, green, blue channelshslHue, saturation, lightnesscmykApproximate print conversionwcagAA and AAA contrast optionsharmoniesMathematical harmony setsvariantsGenerated tone variantsnearestColorsKnowledge graph neighborsStructured sections
Color systems
{
"hex": "#9B111E",
"rgb": [
155,
17,
30
],
"hsl": [
354,
80,
34
],
"cmyk": [
0,
89,
81,
39
],
"luminance": 0.0746,
"contrast": {
"black": 2.49,
"white": 8.43
}
}WCAG
{
"AA": [
"#FFFFFF",
"#F5F5F5"
],
"AAA": [
"#FFFFFF",
"#F5F5F5"
]
}Harmonies
{
"complementary": "#119C8E",
"analogous": [
"#9C1165",
"#9C4911"
],
"triadic": [
"#1F9C11",
"#111F9C"
],
"tetradic": [
"#659C11",
"#119C8E",
"#49119C"
],
"splitComplementary": [
"#119C49",
"#11659C"
],
"monochromatic": [
"#E72336",
"#9B111E",
"#49080F"
]
}Variants
{
"light": "#E72336",
"dark": "#49080F",
"saturated": "#AD0011",
"desaturated": "#89242E",
"pastel": "#DA5260",
"neon": "#D60015"
}Pairings
{
"best": [
"#FFFFFF",
"#119C8E",
"#9C1165",
"#9C4911"
],
"avoid": [
"#89242E",
"#E72336"
],
"neutral": [
"#1A1A1A",
"#F5F5F5",
"#E8E8E4"
],
"highContrast": [
"#FFFFFF"
],
"lowContrast": [
"#E72336",
"#89242E"
]
}Knowledge graph
{
"nearestColors": [
"carmine",
"cranberry",
"tool-red",
"anodized-red",
"firebrick"
],
"generatedPalettes": [
"ruby-red"
],
"generatedComparisons": [
"carmine-vs-ruby-red",
"ruby-red-vs-cranberry"
],
"relatedFamilies": [
"/colors/by-family/red",
"/colors/by-temperature/warm",
"/colors/by-tone/balanced"
],
"relatedTools": [
"/harmonies/ruby-red",
"/wcag/ruby-red",
"/css/colors/ruby-red",
"/hex/9b111e",
"/tools/css-gradient-generator",
"/tools/color-palette-generator",
"/tools/css-color-mixer",
"/tools/contrast-checker"
],
"semanticRelations": {
"broader": [
"/colors/by-family/red",
"/colors/by-temperature/warm",
"/colors/by-tone/balanced"
],
"narrower": [
"/palettes/ruby-red"
],
"related": [
"/colors/carmine",
"/colors/cranberry",
"/colors/tool-red",
"/colors/anodized-red",
"/colors/firebrick",
"/compare/carmine-vs-ruby-red",
"/compare/ruby-red-vs-cranberry",
"/harmonies/ruby-red",
"/wcag/ruby-red",
"/css/colors/ruby-red",
"/hex/9b111e",
"/tools/css-gradient-generator",
"/tools/color-palette-generator",
"/tools/css-color-mixer",
"/tools/contrast-checker"
]
}
}Full JSON dataset
{
"slug": "ruby-red",
"name": "Ruby Red",
"hex": "#9B111E",
"uses": [
"branding accents",
"editorial palettes",
"product design"
],
"psychology": {
"associations": [
"energy",
"intensity",
"attention"
],
"contexts": [
"fashion",
"food",
"sports",
"retail"
],
"avoidIn": [
"low-stimulation wellness interfaces"
]
},
"aliases": [
"ruby"
],
"sourceType": "curated",
"confidence": "medium",
"reviewStatus": "manual",
"sourceUrl": "https://www.colorsencyclopedia.com/assets/colors.json",
"origin": {
"type": "common",
"notes": "Curated common color reference used in design and editorial color systems."
},
"family": "red",
"temperature": "warm",
"tone": [
"balanced"
],
"editorialNotes": "Curated internal color record with computed technical properties.",
"tags": [
"red",
"warm",
"balanced",
"branding-accents",
"editorial-palettes",
"product-design",
"energy",
"intensity",
"attention"
],
"popularity": 84,
"rgb": [
155,
17,
30
],
"hsl": [
354,
80,
34
],
"cmyk": [
0,
89,
81,
39
],
"luminance": 0.0746,
"contrast": {
"black": 2.49,
"white": 8.43
},
"harmonies": {
"complementary": "#119C8E",
"analogous": [
"#9C1165",
"#9C4911"
],
"triadic": [
"#1F9C11",
"#111F9C"
],
"tetradic": [
"#659C11",
"#119C8E",
"#49119C"
],
"splitComplementary": [
"#119C49",
"#11659C"
],
"monochromatic": [
"#E72336",
"#9B111E",
"#49080F"
]
},
"variants": {
"light": "#E72336",
"dark": "#49080F",
"saturated": "#AD0011",
"desaturated": "#89242E",
"pastel": "#DA5260",
"neon": "#D60015"
},
"wcag": {
"AA": [
"#FFFFFF",
"#F5F5F5"
],
"AAA": [
"#FFFFFF",
"#F5F5F5"
]
},
"css": {
"variable": "--color-ruby-red: #9B111E;",
"utility": ".bg-ruby-red { background-color: #9B111E; }",
"textUtility": ".text-ruby-red { color: #9B111E; }"
},
"nearestColors": [
"carmine",
"cranberry",
"tool-red",
"anodized-red",
"firebrick"
],
"generatedPalettes": [
"ruby-red"
],
"generatedComparisons": [
"carmine-vs-ruby-red",
"ruby-red-vs-cranberry"
],
"relatedFamilies": [
"/colors/by-family/red",
"/colors/by-temperature/warm",
"/colors/by-tone/balanced"
],
"relatedTools": [
"/harmonies/ruby-red",
"/wcag/ruby-red",
"/css/colors/ruby-red",
"/hex/9b111e",
"/tools/css-gradient-generator",
"/tools/color-palette-generator",
"/tools/css-color-mixer",
"/tools/contrast-checker"
],
"semanticRelations": {
"broader": [
"/colors/by-family/red",
"/colors/by-temperature/warm",
"/colors/by-tone/balanced"
],
"narrower": [
"/palettes/ruby-red"
],
"related": [
"/colors/carmine",
"/colors/cranberry",
"/colors/tool-red",
"/colors/anodized-red",
"/colors/firebrick",
"/compare/carmine-vs-ruby-red",
"/compare/ruby-red-vs-cranberry",
"/harmonies/ruby-red",
"/wcag/ruby-red",
"/css/colors/ruby-red",
"/hex/9b111e",
"/tools/css-gradient-generator",
"/tools/color-palette-generator",
"/tools/css-color-mixer",
"/tools/contrast-checker"
]
},
"pairings": {
"best": [
"#FFFFFF",
"#119C8E",
"#9C1165",
"#9C4911"
],
"avoid": [
"#89242E",
"#E72336"
],
"neutral": [
"#1A1A1A",
"#F5F5F5",
"#E8E8E4"
],
"highContrast": [
"#FFFFFF"
],
"lowContrast": [
"#E72336",
"#89242E"
]
}
}