Sailing
#869cbb
Muted blue-purple for airy, softened seaside panels
About Sailing
Sailing looks like a clean sky-tinted purple that's been softened by sea air. Compared to Moon Veil's silvery hush and King Neptune's heavier wet depth, this one stays noticeably lighter and drier, with less of that "dusk" haze and less sheen. It's not the periwinkle-with-paint-blinds vibe of Old World either, because Sailing leans a touch more neutral in temperature, so it reads more calm and airy than blue-lavender.
In practice, I use Sailing when I want a purple that feels present but not weighty, especially in dashboards and finance apps where the background is cool-gray and the accent needs to hold its own without turning misty. It's great for secondary action states like selected chips, focus rings that shouldn't look technical, and instructional UI in SaaS onboarding. Compared to the neighboring options, it's the one you reach for when you want contrast that feels light and composed rather than maritime or smoky.
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.