Serenity’s Reign
#507bce
Balanced medium violet-blue for calm, readable contrast
About Serenity’s Reign
Serenity's Reign looks like a calm purple that's been given just enough daylight to stop feeling nocturnal. Compared with Fading Night, it's not smoky or twilight-muted. It reads cleaner and more settled, with a softer blue tilt than Flood and a gentler color density than Blue Jay, so it doesn't punch as hard.
I use it for dashboards and finance apps when the UI needs to feel authoritative but not heavy, especially for links, status pills, and focus states on lightly tinted panels. It also works well in marketing sites for fintech, creator analytics pages, and editorial layouts where the purple has to stay readable next to photos without turning into the "loud" accent. This is the one you reach for when you want cool clarity with a less dramatic profile.
One quirk: on very gray surfaces it holds together better than the deeper blues, but it can still look slightly subdued if your surrounding neutrals are too cool. Pair it with a touch of warmth to keep the tone from going flat.
Code snippets
Copy this color into your project.
Contrast checker
WCAG 2.1 contrast ratios. AA requires 4.5:1 for normal text, 3:1 for large. AAA requires 7:1 / 4.5:1.
On White #ffffff
On Gray 100 #f5f5f5
On Gray 900 #18181b
On Black #000000
Variations
Shades
Darker variations, created by mixing toward black.
Tints
Lighter variations, created by mixing toward white.
Tones
Muted variations, created by reducing saturation.
Hues
Hue rotations around the color wheel.
Temperatures
Warm and cool shifts of this color.
Color harmonies
Suggested palettes
Palettes built around this color.
Community palettes
Published palettes that include this color.