What are the hex codes in the Violet & Cyan Drift palette?

The Violet & Cyan Drift color palette consists of Obsidian #00090B, Violet #7C49FF, Teal #008996, Cyan #00A7E4.

How should I use the Violet & Cyan Drift palette on a website?

Use Cyan #00A7E4 as the background, Obsidian #00090B for text, Violet #7C49FF for buttons and links, and Teal #008996 for accents. 2 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Obsidian on Cyan at 7.33:1.

Which colors in Violet & Cyan Drift have enough contrast for text?

The highest-contrast pair is #00090B on #00A7E4 with a ratio of 7.33:1, which passes WCAG AA for normal text.

#00090BObsidian

#7C49FFViolet

#008996Teal

#00A7E4Cyan

Violet & Cyan Drift color palette

Cyberpunk Neon Cold Black Purple Teal

Color codes click any value to copy

Name	HEX	RGB	HSL	OKLCH
Obsidian	`#00090B`	`rgb(0, 9, 11)`	`hsl(191, 100%, 2%)`	`oklch(12.8% 0.022 207)`
Violet	`#7C49FF`	`rgb(124, 73, 255)`	`hsl(257, 100%, 64%)`	`oklch(57.4% 0.251 289)`
Teal	`#008996`	`rgb(0, 137, 150)`	`hsl(185, 100%, 29%)`	`oklch(57.6% 0.099 207)`
Cyan	`#00A7E4`	`rgb(0, 167, 228)`	`hsl(196, 100%, 45%)`	`oklch(68.6% 0.143 234)`

Why it works and how to use it

Violet & Cyan Drift is a vivid dark, split color palette tagged cyberpunk, neon, cold. A split scheme: Violet plays against Cyan across roughly 72° of hue. Saturation runs high, so use the brightest color sparingly and let the others carry the surface area. The overall temperature is cool.

With 3 chromatic colors, Violet takes the lead while the rest support. Lightness runs from 2% to 64%. Well suited to dark-mode interfaces and gaming.

Background: Cyan (#00A7E4) is the lightest color, so it belongs on large surfaces.
Text: Obsidian (#00090B) on #00A7E4 gives 7.33:1, passing WCAG AAA.
Primary: Violet (#7C49FF) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
Accent: Teal (#008996) for highlights, badges and hover states.

2 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Obsidian on Cyan at 7.33:1.

Preview on a real UI see how the palette feels in context

BrandFeaturesPricingBlogGet started

Design faster with Violet & Cyan Drift

A palette preview that turns four colors into a page, so you can judge hierarchy, contrast and mood before you commit.

Primary action Secondary

Card title

Roles are assigned by lightness.

Color blindness simulation

#00090B

#7C49FF

#008996

#00A7E4

Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.

Palette card

Contrast check WCAG ratios between palette colors

Pair	Sample	Ratio	Level
`#00090B` on `#00A7E4`	Aa	7.33:1	AAA
`#00090B` on `#008996`	Aa	4.81:1	AA
`#00090B` on `#7C49FF`	Aa	4.08:1	AA large only
`#7C49FF` on `#00A7E4`	Aa	1.8:1	Fail
`#008996` on `#00A7E4`	Aa	1.52:1	Fail
`#7C49FF` on `#008996`	Aa	1.18:1	Fail

Similar palettes 24 more in this mood