Noble Knight
#394d78
Noble, deeper violet-blue for steady high-contrast UI panels
About Noble Knight
On a UI mockup, Noble Knight reads like a deep, steady purple that still stays friendly. It doesn't drift as blue as Galaxy Blue, and it avoids Assassin's steel-tinted chill. The undertone feels slightly violet-forward, with more softness in the midtones than Dragonfly, so it lands as a composed headline color rather than a margin accent.
I use it for the places where you want hierarchy without the UI feeling guarded: key panels in HR and learning platforms, primary buttons that shouldn't look heavy, and focused states for forms in productivity and workflow apps. It also works well in media tooling, like chapter selectors or timeline highlights, where you need clarity that holds up across dense layouts. It's the one you reach for when dashboards and finance apps benefit from contrast, but you don't want the interaction to feel "locked down."
Pair it with clean cool grays or near-neutrals so the violet warmth stays readable. Against anything too warm, it can tip slightly flat, like the purple stops pushing forward.
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.