Sapphire Siren
#662288
Cool, deep violet with blue-siren clarity
About Sapphire Siren
I keep noticing Sapphire Siren as that calm, deep-purple you see on a night mode panel right before your eyes stop hunting for contrast. Compared to Queens of the Dead, it feels less smoky and more neatly saturated. Versus Extraviolet, it doesn't have that lifted, neon-adjacent brightness, and it won't drift toward magenta heat. And unlike Intergalactic Settlement's drier, slightly heavier ink, Sapphire Siren holds a smoother, more velvety violet core that reads richer without turning murky.
I use it as Sapphire Siren when selection states and focus rings need to look intentional but not loud, especially in dashboards and finance apps where the UI has to stay disciplined across dense tables and tight spacing. It also shows up well in streaming media layouts for chapter markers and active control highlights when you want the emphasis to stay composed on both light and dark themes. Think creator tools and analytics consoles where hover and active states should feel like one system, not a grab bag.
Quirk: on very cool grays it can look a touch more formal, so I'll pair it with neutrals that have a hint of warmth if the UI feels too restrained.
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.