# Near-black and deep teal color palette

The Near-black and deep teal color palette brings together black, teal, and dark teal. The colors span a moderate lightness range, combining moderate color with clear contrast. Its dark and grounded character suits website sections and interface mockups. Its darkest tone is black, and its lightest tone is teal.

- Also called: Seamless monochrome black and teal radial gradient
- Seed: `kWFw-HKyS_70vPsemcJCga_4`
- Page: https://grabient.com/kWFw-HKyS_70vPsemcJCga_4?style=radialGradient&steps=32&angle=0
- Drawn as: radial gradient, 32 steps, 0 degrees
- Kinds: light center, vivid, dark, cool, seamless
- 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 | `#000303` | `oklch(9.16% 0.0158 189.55)` | Black Hole | white, 20.6 to 1 |
| 2 | `#000606` | `oklch(11.19% 0.0193 189.75)` | Eight Ball | white, 20.3 to 1 |
| 3 | `#000c0b` | `oklch(14.00% 0.0242 190.00)` | Dark Side of the Moon | white, 19.8 to 1 |
| 4 | `#001413` | `oklch(17.37% 0.0300 190.24)` | Black Glaze | white, 18.8 to 1 |
| 5 | `#001e1c` | `oklch(21.06% 0.0363 190.44)` | Stellar Explorer | white, 17.5 to 1 |
| 6 | `#002826` | `oklch(24.85% 0.0428 190.53)` | Teal Spill | white, 15.8 to 1 |
| 7 | `#003230` | `oklch(28.50% 0.0491 190.48)` | Nora’s Forest | white, 14 to 1 |
| 8 | `#003b39` | `oklch(31.78% 0.0548 190.21)` | Customs Green | white, 12.4 to 1 |
| 9 | `#004340` | `oklch(34.50% 0.0596 189.66)` | Warm Black | white, 11.2 to 1 |
| 10 | `#004b47` | `oklch(37.17% 0.0645 188.52)` | Deep Into the Jungle | white, 10 to 1 |
| 11 | `#00534e` | `oklch(39.90% 0.0697 186.88)` | Plankton Green | white, 8.9 to 1 |
| 12 | `#005b54` | `oklch(42.51% 0.0749 185.01)` | Baltic Prince | white, 7.9 to 1 |
| 13 | `#006359` | `oklch(44.82% 0.0798 183.14)` | Dancing Peacock | white, 7.1 to 1 |
| 14 | `#00695d` | `oklch(46.66% 0.0838 181.54)` | Bella Vista | white, 6.6 to 1 |
| 15 | `#006d5f` | `oklch(47.86% 0.0866 180.45)` | Forest Splendour | white, 6.2 to 1 |
| 16 | `#006e60` | `oklch(48.22% 0.0874 180.12)` | Forest Splendour | white, 6.1 to 1 |
| 17 | `#006c5f` | `oklch(47.55% 0.0858 180.82)` | Pacific Queen | white, 6.3 to 1 |
| 18 | `#00665b` | `oklch(45.67% 0.0815 182.65)` | Arizona Stone | white, 6.9 to 1 |
| 19 | `#005c55` | `oklch(42.84% 0.0754 185.32)` | Tidal Pool | white, 7.8 to 1 |
| 20 | `#00514d` | `oklch(39.34% 0.0683 188.51)` | Action Green | white, 9.1 to 1 |
| 21 | `#004644` | `oklch(35.49% 0.0609 191.90)` | Dark Side | white, 10.7 to 1 |
| 22 | `#003a3a` | `oklch(31.56% 0.0538 195.17)` | Customs Green | white, 12.5 to 1 |
| 23 | `#002f31` | `oklch(27.87% 0.0474 198.01)` | Roof Tile Green | white, 14.3 to 1 |
| 24 | `#002729` | `oklch(24.71% 0.0420 200.10)` | Teal Spill | white, 15.9 to 1 |
| 25 | `#002022` | `oklch(22.09% 0.0376 201.28)` | Stellar Explorer | white, 17.1 to 1 |
| 26 | `#00191b` | `oklch(19.54% 0.0332 201.89)` | Black Stallion | white, 18.1 to 1 |
| 27 | `#001315` | `oklch(17.08% 0.0291 202.08)` | Black Glaze | white, 18.9 to 1 |
| 28 | `#000e0f` | `oklch(14.76% 0.0251 201.98)` | Black Glaze | white, 19.6 to 1 |
| 29 | `#00090a` | `oklch(12.64% 0.0215 201.76)` | Black Knight | white, 20.1 to 1 |
| 30 | `#000506` | `oklch(10.77% 0.0183 201.58)` | Eight Ball | white, 20.4 to 1 |
| 31 | `#000304` | `oklch(9.21% 0.0157 201.61)` | Black Hole | white, 20.6 to 1 |
| 32 | `#000203` | `oklch(8.01% 0.0136 202.04)` | Black Hole | white, 20.7 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #000303 0.0%, #000606 3.2%, #000c0b 6.5%, #001413 9.7%, #001e1c 12.9%, #002826 16.1%, #003230 19.4%, #003b39 22.6%, #004340 25.8%, #004b47 29.0%, #00534e 32.3%, #005b54 35.5%, #006359 38.7%, #00695d 41.9%, #006d5f 45.2%, #006e60 48.4%, #006c5f 51.6%, #00665b 54.8%, #005c55 58.1%, #00514d 61.3%, #004644 64.5%, #003a3a 67.7%, #002f31 71.0%, #002729 74.2%, #002022 77.4%, #00191b 80.6%, #001315 83.9%, #000e0f 87.1%, #00090a 90.3%, #000506 93.5%, #000304 96.8%, #000203 100.0%);
background: radial-gradient(circle at 50% 50% in oklch, oklch(9.16% 0.0158 189.55) 0.0%, oklch(11.19% 0.0193 189.75) 3.2%, oklch(14.00% 0.0242 190.00) 6.5%, oklch(17.37% 0.0300 190.24) 9.7%, oklch(21.06% 0.0363 190.44) 12.9%, oklch(24.85% 0.0428 190.53) 16.1%, oklch(28.50% 0.0491 190.48) 19.4%, oklch(31.78% 0.0548 190.21) 22.6%, oklch(34.50% 0.0596 189.66) 25.8%, oklch(37.17% 0.0645 188.52) 29.0%, oklch(39.90% 0.0697 186.88) 32.3%, oklch(42.51% 0.0749 185.01) 35.5%, oklch(44.82% 0.0798 183.14) 38.7%, oklch(46.66% 0.0838 181.54) 41.9%, oklch(47.86% 0.0866 180.45) 45.2%, oklch(48.22% 0.0874 180.12) 48.4%, oklch(47.55% 0.0858 180.82) 51.6%, oklch(45.67% 0.0815 182.65) 54.8%, oklch(42.84% 0.0754 185.32) 58.1%, oklch(39.34% 0.0683 188.51) 61.3%, oklch(35.49% 0.0609 191.90) 64.5%, oklch(31.56% 0.0538 195.17) 67.7%, oklch(27.87% 0.0474 198.01) 71.0%, oklch(24.71% 0.0420 200.10) 74.2%, oklch(22.09% 0.0376 201.28) 77.4%, oklch(19.54% 0.0332 201.89) 80.6%, oklch(17.08% 0.0291 202.08) 83.9%, oklch(14.76% 0.0251 201.98) 87.1%, oklch(12.64% 0.0215 201.76) 90.3%, oklch(10.77% 0.0183 201.58) 93.5%, oklch(9.21% 0.0157 201.61) 96.8%, oklch(8.01% 0.0136 202.04) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.091 | 0.021 | 189.8 |
| 2 | 0.339 | 0.101 | 189.8 |
| 3 | 0.48 | 0.13 | 180.3 |
| 4 | 0.24 | 0.07 | 200.4 |
| 5 | 0.079 | 0.018 | 200.4 |

## In these collections

- [Text gradients](https://grabient.com/text-gradients)
- [Moody gradients](https://grabient.com/moody-gradients)
- [Dark mode UI gradients](https://grabient.com/dark-mode-ui-gradients)

## Other forms

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