Orchid

#7a81ff

Light lavender-violet for soft, airy accents and fills

Save
Share

About Orchid

Picture a purple marker laid over a sticky note: that slightly cool, ink-on-paper feel is Orchid. Compared to 's cyan-forward step, Orchid stays unmistakably purple, and compared to and Öyster Cult it's more relaxed and airy, not as dense or pushy. It reads lighter than the nearby blues, with a softer saturation that keeps it from feeling like it's shouting across a screen.

I usually grab Orchid for dashboards and media interfaces where you want a brand accent that's playful but not juvenile, especially in consumer apps, content platforms, and creative web pages. It works well for secondary buttons, focus states, and section headers when the rest of the UI is leaning gray and you still need personality. It's the one you reach for when you want purple clarity without the heaviness of the deeper shades.

One quirk: it can wash out next to very pale tints, so pair it with a stronger mid-tone or a cooler gray to keep the contrast feeling intentional.

Gradient preview

See how this color looks in an animated mesh gradient.

Conversions

Click any value to copy.

Need this programmatically? Color API

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

Aa
3.28:1FailAA Large

On Gray 100 #f5f5f5

Aa
3.00:1FailAA Large

On Gray 900 #18181b

Aa
5.41:1AAAAA Large

On Black #000000

Aa
6.41:1AAAAA Large

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

Complementary
Analogous
Triadic
Split Complementary
Tetradic

Suggested palettes

Palettes built around this color.

4 colors
3 colors
4 colors
4 colors

Community palettes

Published palettes that include this color.

Similar colors

Create a gradient with Orchid

Open the generator with this color pre-loaded.

Start creating