# Near-black, deep cyan and violet cyberpunk palette

The Near-black, deep cyan and violet cyberpunk palette brings together dark blue, blue, teal, and purple. The colors span a broad lightness range, combining strong color with clear contrast. Its bold and dramatic character suits game interface concepts and stream graphics. Its darkest tone is dark blue, and its lightest tone is teal.

- Also called: Black, light blue and blue linear gradient
- Seed: `kYHBW4m5a-7GmP5Kqb2ZTE9MdZyi`
- Page: https://grabient.com/kYHBW4m5a-7GmP5Kqb2ZTE9MdZyi?steps=32&angle=45
- Drawn as: linear gradient, 32 steps, 45 degrees
- Kinds: light center, vivid, cool, monochrome
- Hues: analogous
- Contrast of its darkest and lightest colors: 11.2 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 | `#01040e` | `oklch(11.02% 0.0289 259.45)` | Ninja | white, 20.4 to 1 |
| 2 | `#010612` | `oklch(12.06% 0.0323 258.51)` | Eight Ball | white, 20.2 to 1 |
| 3 | `#010817` | `oklch(13.43% 0.0368 257.17)` | Melanophobia | white, 20 to 1 |
| 4 | `#010b1d` | `oklch(15.08% 0.0422 255.59)` | Melanophobia | white, 19.6 to 1 |
| 5 | `#010f24` | `oklch(16.96% 0.0482 253.95)` | Kuretake Black Manga | white, 19.1 to 1 |
| 6 | `#01142b` | `oklch(19.01% 0.0545 252.43)` | Squid’s Ink | white, 18.4 to 1 |
| 7 | `#001933` | `oklch(21.20% 0.0608 251.20)` | Oxford by Night | white, 17.6 to 1 |
| 8 | `#001f3c` | `oklch(23.54% 0.0673 250.45)` | Midnight Mirage | white, 16.6 to 1 |
| 9 | `#002547` | `oklch(26.13% 0.0746 250.32)` | Rhapsody in Blue | white, 15.4 to 1 |
| 10 | `#002c52` | `oklch(28.90% 0.0824 250.27)` | Indigo Black | white, 14.1 to 1 |
| 11 | `#00335e` | `oklch(31.79% 0.0901 250.06)` | Effervescent Blue | white, 12.7 to 1 |
| 12 | `#003b6a` | `oklch(34.77% 0.0971 249.58)` | Ateneo Blue | white, 11.4 to 1 |
| 13 | `#004475` | `oklch(37.78% 0.1029 248.50)` | Mermaid Blues | white, 10 to 1 |
| 14 | `#004d7f` | `oklch(40.79% 0.1063 246.61)` | Cook’s Bay | white, 8.8 to 1 |
| 15 | `#005789` | `oklch(43.86% 0.1081 243.96)` | Dark Denim | white, 7.7 to 1 |
| 16 | `#006192` | `oklch(47.01% 0.1092 240.80)` | Felix | white, 6.7 to 1 |
| 17 | `#006c9a` | `oklch(50.21% 0.1101 237.28)` | Disarm | white, 5.8 to 1 |
| 18 | `#0076a3` | `oklch(53.44% 0.1112 233.60)` | Summer Lake | white, 5 to 1 |
| 19 | `#0082ac` | `oklch(56.70% 0.1129 229.91)` | Tusche Blue | black, 4.7 to 1 |
| 20 | `#008db5` | `oklch(60.06% 0.1150 226.14)` | Spinnaker Blue | black, 5.4 to 1 |
| 21 | `#059cbe` | `oklch(64.17% 0.1165 220.55)` | Sea Wonder | black, 6.5 to 1 |
| 22 | `#16acc6` | `oklch(68.70% 0.1174 213.93)` | Havasupai Falls | black, 7.7 to 1 |
| 23 | `#26bcce` | `oklch(73.06% 0.1189 207.72)` | Holiday Blue | black, 9.1 to 1 |
| 24 | `#2ec9d6` | `oklch(76.69% 0.1221 203.31)` | Sea Serpent | black, 10.4 to 1 |
| 25 | `#29d2de` | `oklch(79.00% 0.1278 202.15)` | Aztec Turquoise | black, 11.3 to 1 |
| 26 | `#00d4e6` | `oklch(79.43% 0.1358 205.68)` | Aztec Turquoise | black, 11.5 to 1 |
| 27 | `#00caed` | `oklch(77.40% 0.1372 215.67)` | Picnic Day Sky | black, 10.7 to 1 |
| 28 | `#00b8f4` | `oklch(73.47% 0.1475 230.66)` | Zima Blue | black, 9.1 to 1 |
| 29 | `#219fff` | `oklch(68.50% 0.1744 248.17)` | Brilliant Azure | black, 7.4 to 1 |
| 30 | `#5180ff` | `oklch(63.34% 0.1959 265.74)` | Flickery C64 | black, 5.8 to 1 |
| 31 | `#6d5dff` | `oklch(58.86% 0.2304 280.90)` | Blue Genie | black, 4.6 to 1 |
| 32 | `#7d43f5` | `oklch(55.91% 0.2467 291.16)` | Sweet Escape | white, 5.2 to 1 |

## CSS

```css
background: linear-gradient(45deg, #01040e 0.0%, #010612 3.2%, #010817 6.5%, #010b1d 9.7%, #010f24 12.9%, #01142b 16.1%, #001933 19.4%, #001f3c 22.6%, #002547 25.8%, #002c52 29.0%, #00335e 32.3%, #003b6a 35.5%, #004475 38.7%, #004d7f 41.9%, #005789 45.2%, #006192 48.4%, #006c9a 51.6%, #0076a3 54.8%, #0082ac 58.1%, #008db5 61.3%, #059cbe 64.5%, #16acc6 67.7%, #26bcce 71.0%, #2ec9d6 74.2%, #29d2de 77.4%, #00d4e6 80.6%, #00caed 83.9%, #00b8f4 87.1%, #219fff 90.3%, #5180ff 93.5%, #6d5dff 96.8%, #7d43f5 100.0%);
background: linear-gradient(45deg in oklch, oklch(11.02% 0.0289 259.45) 0.0%, oklch(12.06% 0.0323 258.51) 3.2%, oklch(13.43% 0.0368 257.17) 6.5%, oklch(15.08% 0.0422 255.59) 9.7%, oklch(16.96% 0.0482 253.95) 12.9%, oklch(19.01% 0.0545 252.43) 16.1%, oklch(21.20% 0.0608 251.20) 19.4%, oklch(23.54% 0.0673 250.45) 22.6%, oklch(26.13% 0.0746 250.32) 25.8%, oklch(28.90% 0.0824 250.27) 29.0%, oklch(31.79% 0.0901 250.06) 32.3%, oklch(34.77% 0.0971 249.58) 35.5%, oklch(37.78% 0.1029 248.50) 38.7%, oklch(40.79% 0.1063 246.61) 41.9%, oklch(43.86% 0.1081 243.96) 45.2%, oklch(47.01% 0.1092 240.80) 48.4%, oklch(50.21% 0.1101 237.28) 51.6%, oklch(53.44% 0.1112 233.60) 54.8%, oklch(56.70% 0.1129 229.91) 58.1%, oklch(60.06% 0.1150 226.14) 61.3%, oklch(64.17% 0.1165 220.55) 64.5%, oklch(68.70% 0.1174 213.93) 67.7%, oklch(73.06% 0.1189 207.72) 71.0%, oklch(76.69% 0.1221 203.31) 74.2%, oklch(79.00% 0.1278 202.15) 77.4%, oklch(79.43% 0.1358 205.68) 80.6%, oklch(77.40% 0.1372 215.67) 83.9%, oklch(73.47% 0.1475 230.66) 87.1%, oklch(68.50% 0.1744 248.17) 90.3%, oklch(63.34% 0.1959 265.74) 93.5%, oklch(58.86% 0.2304 280.90) 96.8%, oklch(55.91% 0.2467 291.16) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.11 | 0.029 | 259.5 |
| 2 | 0.217 | 0.062 | 251 |
| 3 | 0.39 | 0.105 | 247.8 |
| 4 | 0.587 | 0.114 | 227.8 |
| 5 | 0.795 | 0.135 | 204.5 |
| 6 | 0.559 | 0.247 | 291.2 |

## In these collections

- [Cyberpunk gradients](https://grabient.com/cyberpunk-gradients)

## Other forms

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