RoyalBlue Color — HEX, RGB, HSL, Palettes & Contrast

RoyalBlue (#4169e1): Complete color reference with HEX, RGB, HSL values, tints & shades, complementary, analogous, triadic, split-complementary, and tetradic palettes, WCAG contrast recommendations, and ready-to-use CSS code.

#4169e1
HEX #4169e1
RGB rgb(65, 105, 225)
HSL 225°, 73%, 57%

Use RoyalBlue in Your Projects

🎨 Open in Color Picker 🌈 Generate Palette 👁️ Check Contrast 🔄 Convert Color 🌊 Use in Gradient

About RoyalBlue Color

RoyalBlue is a vibrant, medium-dark blue that conveys authority and confidence. It is a popular choice for corporate branding, government sites, and financial apps.

Use Cases for RoyalBlue

corporate brandinggovernment sitesfinancial appsCTA buttonstrust signals

Shades & Tints of RoyalBlue

#ffffff
#d0daf8
#a0b4f0
#718fe9
#4169e1
#314fa9
#213571
#101a38
#000000

Complementary Color

#4169e1
#e1b941

Analogous Colors

#41b9e1
#4169e1
#6941e1

Triadic Colors

#4169e1
#e14169
#69e141

Split Complementary

#4169e1
#e16941
#b9e141

Tetradic Colors

#4169e1
#b941e1
#e1b941
#69e141

CSS Code

.royalblue-color {
  color: #4169e1;
  background-color: #4169e1;
}

/* As a CSS custom property */
:root {
  --color-royalblue: #4169e1;
}

Accessibility Score

75 / 100
Rating: Good
✓ AA contrast on best text color (30 pts)
✗ AAA contrast on best text color (25 pts)
✓ Versatile lightness for backgrounds & text (25 pts)
✓ Not extreme black/white (20 pts)

A combined score based on WCAG contrast compliance, lightness versatility, and usable range. Higher scores mean the color works well in more design contexts.

Contrast Recommendations

Black text on RoyalBlue
Ratio: 4.33:1 ✗ Fails AA ✗ Fails AAA
White text on RoyalBlue
Ratio: 4.85:1 ✓ Passes AA ✗ Fails AAA

Related Colors

DodgerBlue
SteelBlue
CornflowerBlue
MediumBlue
Navy

Related Tools

Frequently Asked Questions

What color is RoyalBlue?

RoyalBlue is represented by the hex code #4169e1 and has RGB values of rgb(65, 105, 225). It falls under the Blue category.

How to use RoyalBlue in web design?

RoyalBlue works well for corporate branding, government sites, financial apps. RoyalBlue is a vibrant, medium-dark blue that conveys authority and confidence. It is a popular choice for corporate branding, government sites, and financial apps. Use it as a primary color, accent, or background depending on your design needs.

What colors go with RoyalBlue?

Colors that pair well with RoyalBlue include dodgerblue, steelblue, cornflowerblue, mediumblue, navy. For a complementary scheme, try #e1b941. For an analogous scheme, use #41b9e1 and #6941e1. For a triadic scheme, combine with #e14169 and #69e141.