Tangent Periwinkle
#50507f
Balanced periwinkle violet for softer focus overlays
About Tangent Periwinkle
Tangent Periwinkle reads like a periwinkle that got a little more structure, not just lighter purple. Compared to Twilight, it feels slightly more lavender-leaning and less night-dense, so it doesn't pull toward deeper indigo at a glance. And vs Dusk, it stays cleaner and airier, avoiding that heavier, subdued dusk weight.
On screens, I use it for interfaces that need a confident purple accent without tipping into seriousness. It's great for media playback controls and waveform playhead ticks, where you want the highlight to feel distinct but not loud. It also works well in creator dashboards and editorial sidebars, especially for hover states, selection rings, and tab indicators in music and podcast apps. The one you reach for when you want purple to look intentional on both dark-mode chrome and cool off-whites.
One quirk: if you place it next to Freshly Purpleized, this shade shows up a touch more saturated and more "ink-clean," so pick the lighter violet only when you need the gentlest, most diluted hit.
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.
Similar colors
Create a gradient with Tangent Periwinkle
Open the generator with this color pre-loaded.
Start creating