# Near-black, teal and indigo color palette

The Near-black, teal and indigo color palette brings together dark blue, green, pale green, and blue. The colors span a very broad lightness range, combining strong color with high contrast. Its bold and dramatic character suits game interface concepts and stream graphics. Its darkest tone is dark blue, and its lightest tone is pale green.

- Also called: Black, navy, teal and blue linear gradient
- Seed: `kWIR28JhW9-65tp5lz_QUfLo`
- Page: https://grabient.com/kWIR28JhW9-65tp5lz_QUfLo?steps=32&angle=135
- Drawn as: linear gradient, 32 steps, 135 degrees
- Kinds: light center, vivid, cool
- Hues: wide
- Contrast of its darkest and lightest colors: 19.4 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 | `#020617` | `oklch(12.99% 0.0400 264.38)` | Melanophobia | white, 20.1 to 1 |
| 2 | `#03081a` | `oklch(14.06% 0.0409 263.47)` | Melanophobia | white, 19.9 to 1 |
| 3 | `#040b1d` | `oklch(15.17% 0.0416 262.75)` | Melanophobia | white, 19.6 to 1 |
| 4 | `#050d20` | `oklch(16.47% 0.0424 261.92)` | Void | white, 19.3 to 1 |
| 5 | `#061125` | `oklch(18.12% 0.0436 260.69)` | Kuretake Black Manga | white, 18.8 to 1 |
| 6 | `#09162b` | `oklch(20.26% 0.0457 258.76)` | Liberty Blue | white, 18 to 1 |
| 7 | `#0c1d34` | `oklch(23.05% 0.0491 255.84)` | Trapped Darkness | white, 16.8 to 1 |
| 8 | `#10273f` | `oklch(26.63% 0.0541 251.64)` | Cool Balaclavas Are Forever | white, 15.2 to 1 |
| 9 | `#12334e` | `oklch(31.18% 0.0613 245.81)` | Sea of Stars | white, 13 to 1 |
| 10 | `#104662` | `oklch(37.38% 0.0728 237.37)` | Stegadon Scale Green | white, 10.1 to 1 |
| 11 | `#005e7a` | `oklch(45.01% 0.0867 226.71)` | Blue Edge | white, 7.2 to 1 |
| 12 | `#007b8f` | `oklch(53.50% 0.0943 214.66)` | Jade Shard | white, 4.9 to 1 |
| 13 | `#0099a2` | `oklch(62.27% 0.1060 202.18)` | Island Dream | black, 6.1 to 1 |
| 14 | `#00b8b2` | `oklch(70.76% 0.1221 190.19)` | Jade Gravel | black, 8.5 to 1 |
| 15 | `#00d6bb` | `oklch(78.40% 0.1427 179.57)` | Channel Marker Green | black, 11.3 to 1 |
| 16 | `#2eedbf` | `oklch(84.61% 0.1574 171.24)` | Aquamarine | black, 13.9 to 1 |
| 17 | `#5afbc2` | `oklch(89.04% 0.1574 165.74)` | Rare Wind | black, 16 to 1 |
| 18 | `#9bffce` | `oklch(92.53% 0.1168 161.57)` | Neo Mint | black, 17.5 to 1 |
| 19 | `#c7ffdd` | `oklch(95.26% 0.0727 158.55)` | Mint Zest | black, 18.7 to 1 |
| 20 | `#dfffea` | `oklch(97.18% 0.0427 156.81)` | Crystal Glass | black, 19.6 to 1 |
| 21 | `#ecfff2` | `oklch(98.26% 0.0259 156.52)` | Azure Mist | black, 20.1 to 1 |
| 22 | `#eefff4` | `oklch(98.49% 0.0223 157.79)` | Azure Mist | black, 20.2 to 1 |
| 23 | `#e6fff1` | `oklch(97.81% 0.0319 160.79)` | Mint Chiffon | black, 19.9 to 1 |
| 24 | `#d1ffea` | `oklch(96.21% 0.0549 165.64)` | Mint Coffee | black, 19.1 to 1 |
| 25 | `#baf8e5` | `oklch(93.27% 0.0679 173.22)` | Shallow End | black, 17.6 to 1 |
| 26 | `#9aebdf` | `oklch(88.34% 0.0807 184.75)` | Oasis Stream | black, 15.2 to 1 |
| 27 | `#6cd8dc` | `oklch(82.00% 0.0994 199.02)` | Aquamarine Blue | black, 12.4 to 1 |
| 28 | `#32c1dd` | `oklch(74.88% 0.1214 214.75)` | Caribbean Blue | black, 9.7 to 1 |
| 29 | `#00a5db` | `oklch(67.61% 0.1357 230.66)` | Vanadyl Blue | black, 7.3 to 1 |
| 30 | `#0089d8` | `oklch(60.82% 0.1545 245.44)` | Blue Cola | black, 5.5 to 1 |
| 31 | `#1a6ddb` | `oklch(55.13% 0.1847 257.80)` | Flickr Blue | white, 4.9 to 1 |
| 32 | `#3358d5` | `oklch(51.18% 0.1970 266.49)` | Bnei Brak Bay | white, 5.9 to 1 |

## CSS

```css
background: linear-gradient(135deg, #020617 0.0%, #03081a 3.2%, #040b1d 6.5%, #050d20 9.7%, #061125 12.9%, #09162b 16.1%, #0c1d34 19.4%, #10273f 22.6%, #12334e 25.8%, #104662 29.0%, #005e7a 32.3%, #007b8f 35.5%, #0099a2 38.7%, #00b8b2 41.9%, #00d6bb 45.2%, #2eedbf 48.4%, #5afbc2 51.6%, #9bffce 54.8%, #c7ffdd 58.1%, #dfffea 61.3%, #ecfff2 64.5%, #eefff4 67.7%, #e6fff1 71.0%, #d1ffea 74.2%, #baf8e5 77.4%, #9aebdf 80.6%, #6cd8dc 83.9%, #32c1dd 87.1%, #00a5db 90.3%, #0089d8 93.5%, #1a6ddb 96.8%, #3358d5 100.0%);
background: linear-gradient(135deg in oklch, oklch(12.99% 0.0400 264.38) 0.0%, oklch(14.06% 0.0409 263.47) 3.2%, oklch(15.17% 0.0416 262.75) 6.5%, oklch(16.47% 0.0424 261.92) 9.7%, oklch(18.12% 0.0436 260.69) 12.9%, oklch(20.26% 0.0457 258.76) 16.1%, oklch(23.05% 0.0491 255.84) 19.4%, oklch(26.63% 0.0541 251.64) 22.6%, oklch(31.18% 0.0613 245.81) 25.8%, oklch(37.38% 0.0728 237.37) 29.0%, oklch(45.01% 0.0867 226.71) 32.3%, oklch(53.50% 0.0943 214.66) 35.5%, oklch(62.27% 0.1060 202.18) 38.7%, oklch(70.76% 0.1221 190.19) 41.9%, oklch(78.40% 0.1427 179.57) 45.2%, oklch(84.61% 0.1574 171.24) 48.4%, oklch(89.04% 0.1574 165.74) 51.6%, oklch(92.53% 0.1168 161.57) 54.8%, oklch(95.26% 0.0727 158.55) 58.1%, oklch(97.18% 0.0427 156.81) 61.3%, oklch(98.26% 0.0259 156.52) 64.5%, oklch(98.49% 0.0223 157.79) 67.7%, oklch(97.81% 0.0319 160.79) 71.0%, oklch(96.21% 0.0549 165.64) 74.2%, oklch(93.27% 0.0679 173.22) 77.4%, oklch(88.34% 0.0807 184.75) 80.6%, oklch(82.00% 0.0994 199.02) 83.9%, oklch(74.88% 0.1214 214.75) 87.1%, oklch(67.61% 0.1357 230.66) 90.3%, oklch(60.82% 0.1545 245.44) 93.5%, oklch(55.13% 0.1847 257.80) 96.8%, oklch(51.18% 0.1970 266.49) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.13 | 0.04 | 264.4 |
| 2 | 0.299 | 0.059 | 247.5 |
| 3 | 0.87 | 0.158 | 168.2 |
| 4 | 0.957 | 0.063 | 167.2 |
| 5 | 0.512 | 0.197 | 266.5 |

## In these collections

- [Neon gradients](https://grabient.com/neon-gradients)
- [Aurora gradients](https://grabient.com/aurora-gradients)

## Other forms

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