Royal Blue color guide
Bright, saturated and unmistakably digital. It is the blue most software defaults to, which makes it legible and trustworthy but rarely distinctive on its own.
- Best for
- Primary buttons and links that need to read as interactive.
Accessibility
Ratios follow WCAG 2.1. AA needs 4.5:1 for body text, AAA needs 7:1; large text passes AA at 3:1.
Colors that go with royal blue
Combinations that hold up in a real layout rather than only on the colour wheel.
Royal Blue color harmonies
Royal Blue shades and tints
The same hue and saturation across ten lightness steps — the basis of a usable colour ramp in a design system.
Royal Blue FAQ
What is the hex code for royal blue?
Royal Blue is #4169E1. In other formats that is rgb(65, 105, 225), hsl(225, 73%, 57%), and approximately cmyk(71%, 53%, 0%, 12%) for print.
What colors go with royal blue?
White, Charcoal, Gold all pair well with royal blue. Primary buttons and links that need to read as interactive.
Is royal blue accessible for text?
Yes — royal blue text on white reaches 4.85:1, which passes WCAG AA for body text.
Should text on royal blue be black or white?
Use white text. It gives the higher contrast ratio of the two against #4169E1.