# Turquoise, indigo and violet cyberpunk palette

The Turquoise, indigo and violet cyberpunk palette brings together teal, blue, and purple. The colors span a moderate lightness range, combining strong color with gentle contrast. Its balanced and composed character suits game interface concepts and stream graphics. Its darkest tone is blue, and its lightest tone is teal.

- Also called: Cool light blue to blue angular gradient
- Seed: `kWwDuUzjPFEHYwY_aUEwmnBw`
- Page: https://grabient.com/kWwDuUzjPFEHYwY_aUEwmnBw?style=angularGradient&steps=10&angle=30
- Drawn as: angular gradient, 10 steps, 30 degrees
- Kinds: vivid, cool
- Hues: analogous
- Contrast of its darkest and lightest colors: 3.3 to 1

## Colors

The name most people give each color, and the text color that reads on it with its contrast.

| Stop | Hex | OKLCH | Name | Text on it |
| --- | --- | --- | --- | --- |
| 1 | `#6ebecb` | `oklch(75.59% 0.0813 208.83)` | Luna Moona | black, 9.9 to 1 |
| 2 | `#4fabcf` | `oklch(70.03% 0.1018 226.74)` | Maximum Blue | black, 8 to 1 |
| 3 | `#3d8ed5` | `oklch(62.88% 0.1330 248.40)` | Magical Merlin | black, 6 to 1 |
| 4 | `#3075de` | `oklch(57.52% 0.1749 259.04)` | Skies of Cyberspace | black, 4.7 to 1 |
| 5 | `#215ceb` | `oklch(53.15% 0.2242 263.62)` | Azul | white, 5.5 to 1 |
| 6 | `#2e44f5` | `oklch(50.52% 0.2586 268.35)` | Bright Greek | white, 6.4 to 1 |
| 7 | `#3f30fc` | `oklch(49.65% 0.2796 272.66)` | System Shock Blue | white, 6.9 to 1 |
| 8 | `#511dff` | `oklch(49.69% 0.2885 278.08)` | Han Purple | white, 7 to 1 |
| 9 | `#6909ff` | `oklch(50.84% 0.2917 286.07)` | Electric Indigo | white, 6.8 to 1 |
| 10 | `#7900fc` | `oklch(51.98% 0.2900 292.31)` | Poisoning Purple | white, 6.5 to 1 |

## CSS

```css
background: conic-gradient(from 30deg, #6ebecb 0.0%, #4fabcf 11.1%, #3d8ed5 22.2%, #3075de 33.3%, #215ceb 44.4%, #2e44f5 55.6%, #3f30fc 66.7%, #511dff 77.8%, #6909ff 88.9%, #7900fc 100.0%);
background: conic-gradient(from 30deg in oklch, oklch(75.59% 0.0813 208.83) 0.0%, oklch(70.03% 0.1018 226.74) 11.1%, oklch(62.88% 0.1330 248.40) 22.2%, oklch(57.52% 0.1749 259.04) 33.3%, oklch(53.15% 0.2242 263.62) 44.4%, oklch(50.52% 0.2586 268.35) 55.6%, oklch(49.65% 0.2796 272.66) 66.7%, oklch(49.69% 0.2885 278.08) 77.8%, oklch(50.84% 0.2917 286.07) 88.9%, oklch(51.98% 0.2900 292.31) 100.0%);
```

## Keyframes

5 OKLCH keyframes joined by a Catmull-Rom spline. Hue is unwrapped degrees.

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.756 | 0.081 | 208.8 |
| 2 | 0.614 | 0.142 | 252.2 |
| 3 | 0.516 | 0.244 | 265.9 |
| 4 | 0.496 | 0.289 | 276.5 |
| 5 | 0.52 | 0.291 | 292.3 |

## In these collections

- [Cyberpunk gradients](https://grabient.com/cyberpunk-gradients)
- [Blue and mauve gradients](https://grabient.com/blue-and-mauve-gradients)
- [Electric purple gradients](https://grabient.com/electric-purple-gradients)

## Other forms

- [JSON](https://grabient.com/kWwDuUzjPFEHYwY_aUEwmnBw.json?style=angularGradient&steps=10&angle=30)
- [PNG](https://grabient.com/kWwDuUzjPFEHYwY_aUEwmnBw.png?style=angularGradient&steps=10&angle=30)
- [SVG](https://grabient.com/kWwDuUzjPFEHYwY_aUEwmnBw.svg?style=angularGradient&steps=10&angle=30)
- [CSS](https://grabient.com/kWwDuUzjPFEHYwY_aUEwmnBw.css?style=angularGradient&steps=10&angle=30)
- [ASE](https://grabient.com/kWwDuUzjPFEHYwY_aUEwmnBw.ase?style=angularGradient&steps=10&angle=30)
- [GPL](https://grabient.com/kWwDuUzjPFEHYwY_aUEwmnBw.gpl?style=angularGradient&steps=10&angle=30)
- [GRD](https://grabient.com/kWwDuUzjPFEHYwY_aUEwmnBw.grd?style=angularGradient&steps=10&angle=30)
- [Design tokens](https://grabient.com/kWwDuUzjPFEHYwY_aUEwmnBw.tokens.json?style=angularGradient&steps=10&angle=30)
- [Social card](https://grabient.com/api/og?seed=kWwDuUzjPFEHYwY_aUEwmnBw&style=angularGradient&steps=10&angle=30)
- [Palettes like this one](https://grabient.com/palettes?q=kWwDuUzjPFEHYwY_aUEwmnBw)
- [Guide for agents](https://grabient.com/llms.txt)