# Near-black and yellow green palette

The Near-black and yellow green palette brings together black, green, and light yellow. The colors span a very broad lightness range, combining strong color with high contrast. Its bold and dramatic character suits brand mood boards and editorial graphics. Its darkest tone is black, and its lightest tone is light yellow.

- Also called: Seamless black, green and yellow angular gradient
- Seed: `kaFgCAw6Y8-DjPh5tbz3t1DD6ywoKgE2A`
- Page: https://grabient.com/kaFgCAw6Y8-DjPh5tbz3t1DD6ywoKgE2A?style=angularGradient&steps=34
- Drawn as: angular gradient, 34 steps, 90 degrees
- Kinds: light center, vivid, seamless
- Hues: analogous
- Contrast of its darkest and lightest colors: 18.5 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 | `#020202` | `oklch(8.66% 0.0000 89.88)` | Black Hole | white, 20.7 to 1 |
| 2 | `#050b0a` | `oklch(14.34% 0.0118 177.51)` | Dark Side of the Moon | white, 19.7 to 1 |
| 3 | `#0d201a` | `oklch(22.47% 0.0277 172.95)` | Black Emerald | white, 16.9 to 1 |
| 4 | `#173a2e` | `oklch(31.89% 0.0469 167.66)` | Palm Green | white, 12.4 to 1 |
| 5 | `#225740` | `oklch(41.37% 0.0688 162.26)` | Rousseau Green | white, 8.3 to 1 |
| 6 | `#2c724d` | `oklch(49.75% 0.0924 157.38)` | Green Velvet | white, 5.7 to 1 |
| 7 | `#2f8853` | `oklch(56.05% 0.1187 153.58)` | Lake Green | black, 4.7 to 1 |
| 8 | `#219c4f` | `oklch(61.02% 0.1539 150.59)` | Get up and Go | black, 5.9 to 1 |
| 9 | `#00ad45` | `oklch(65.17% 0.1885 148.02)` | Poison Ivy | black, 7 to 1 |
| 10 | `#00bb38` | `oklch(68.83% 0.2130 145.55)` | Toxic Sludge | black, 8.1 to 1 |
| 11 | `#00c810` | `oklch(72.32% 0.2435 142.82)` | Pressing My Luck | black, 9.3 to 1 |
| 12 | `#48d300` | `oklch(75.98% 0.2420 139.50)` | First of the Month Green | black, 10.5 to 1 |
| 13 | `#76dd00` | `oklch(80.31% 0.2336 134.76)` | King Lizard | black, 12.1 to 1 |
| 14 | `#a0e800` | `oklch(85.10% 0.2250 128.79)` | Scorpion Venom | black, 14 to 1 |
| 15 | `#c5f134` | `oklch(89.67% 0.2051 122.69)` | Pick Your Poison | black, 16 to 1 |
| 16 | `#e0f864` | `oklch(93.34% 0.1727 117.57)` | Mystic Green | black, 17.7 to 1 |
| 17 | `#eefc7d` | `oklch(95.43% 0.1511 114.52)` | Hyper Beam | black, 18.7 to 1 |
| 18 | `#edfb7f` | `oklch(95.29% 0.1494 114.60)` | Hyper Beam | black, 18.7 to 1 |
| 19 | `#dff66a` | `oklch(92.93% 0.1663 117.71)` | Mystic Green | black, 17.5 to 1 |
| 20 | `#c4ee45` | `oklch(89.00% 0.1938 122.87)` | Lime Fizz | black, 15.6 to 1 |
| 21 | `#9ce500` | `oklch(84.15% 0.2234 129.08)` | Quithayran Green | black, 13.6 to 1 |
| 22 | `#70d900` | `oklch(79.07% 0.2322 135.30)` | Radioactive Lilypad | black, 11.6 to 1 |
| 23 | `#39ce00` | `oklch(74.41% 0.2424 140.55)` | Candy Green | black, 10 to 1 |
| 24 | `#00c121` | `oklch(70.28% 0.2309 143.58)` | Waystone Green | black, 8.6 to 1 |
| 25 | `#00b130` | `oklch(66.20% 0.2082 145.01)` | Pikkoro Green | black, 7.3 to 1 |
| 26 | `#00a237` | `oklch(61.95% 0.1862 146.59)` | Poetic Green | black, 6.2 to 1 |
| 27 | `#009142` | `oklch(57.33% 0.1576 150.08)` | Viper Green | black, 5.1 to 1 |
| 28 | `#007e4c` | `oklch(52.11% 0.1236 157.23)` | Picture Book Green | white, 5.1 to 1 |
| 29 | `#006850` | `oklch(45.93% 0.0908 170.13)` | Peacock Green | white, 6.8 to 1 |
| 30 | `#004d4b` | `oklch(38.08% 0.0656 190.56)` | Swamp Mausoleum | white, 9.6 to 1 |
| 31 | `#00323c` | `oklch(29.37% 0.0520 215.38)` | Artist Blue | white, 13.7 to 1 |
| 32 | `#041a29` | `oklch(20.80% 0.0413 240.61)` | Oxford by Night | white, 17.7 to 1 |
| 33 | `#05080f` | `oklch(13.43% 0.0171 262.73)` | Narwhal Grey | white, 20 to 1 |
| 34 | `#020202` | `oklch(8.27% 0.0000 89.88)` | Black Hole | white, 20.7 to 1 |

## CSS

```css
background: conic-gradient(from 90deg, #020202 0.0%, #050b0a 3.0%, #0d201a 6.1%, #173a2e 9.1%, #225740 12.1%, #2c724d 15.2%, #2f8853 18.2%, #219c4f 21.2%, #00ad45 24.2%, #00bb38 27.3%, #00c810 30.3%, #48d300 33.3%, #76dd00 36.4%, #a0e800 39.4%, #c5f134 42.4%, #e0f864 45.5%, #eefc7d 48.5%, #edfb7f 51.5%, #dff66a 54.5%, #c4ee45 57.6%, #9ce500 60.6%, #70d900 63.6%, #39ce00 66.7%, #00c121 69.7%, #00b130 72.7%, #00a237 75.8%, #009142 78.8%, #007e4c 81.8%, #006850 84.8%, #004d4b 87.9%, #00323c 90.9%, #041a29 93.9%, #05080f 97.0%, #020202 100.0%);
background: conic-gradient(from 90deg in oklch, oklch(8.66% 0.0000 89.88) 0.0%, oklch(14.34% 0.0118 177.51) 3.0%, oklch(22.47% 0.0277 172.95) 6.1%, oklch(31.89% 0.0469 167.66) 9.1%, oklch(41.37% 0.0688 162.26) 12.1%, oklch(49.75% 0.0924 157.38) 15.2%, oklch(56.05% 0.1187 153.58) 18.2%, oklch(61.02% 0.1539 150.59) 21.2%, oklch(65.17% 0.1885 148.02) 24.2%, oklch(68.83% 0.2130 145.55) 27.3%, oklch(72.32% 0.2435 142.82) 30.3%, oklch(75.98% 0.2420 139.50) 33.3%, oklch(80.31% 0.2336 134.76) 36.4%, oklch(85.10% 0.2250 128.79) 39.4%, oklch(89.67% 0.2051 122.69) 42.4%, oklch(93.34% 0.1727 117.57) 45.5%, oklch(95.43% 0.1511 114.52) 48.5%, oklch(95.29% 0.1494 114.60) 51.5%, oklch(92.93% 0.1663 117.71) 54.5%, oklch(89.00% 0.1938 122.87) 57.6%, oklch(84.15% 0.2234 129.08) 60.6%, oklch(79.07% 0.2322 135.30) 63.6%, oklch(74.41% 0.2424 140.55) 66.7%, oklch(70.28% 0.2309 143.58) 69.7%, oklch(66.20% 0.2082 145.01) 72.7%, oklch(61.95% 0.1862 146.59) 75.8%, oklch(57.33% 0.1576 150.08) 78.8%, oklch(52.11% 0.1236 157.23) 81.8%, oklch(45.93% 0.0908 170.13) 84.8%, oklch(38.08% 0.0656 190.56) 87.9%, oklch(29.37% 0.0520 215.38) 90.9%, oklch(20.80% 0.0413 240.61) 93.9%, oklch(13.43% 0.0171 262.73) 97.0%, oklch(8.27% 0.0000 89.88) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.087 | 0 | 180.7 |
| 2 | 0.531 | 0.105 | 155.3 |
| 3 | 0.76 | 0.273 | 139.5 |
| 4 | 0.957 | 0.147 | 114.1 |
| 5 | 0.744 | 0.256 | 140.5 |
| 6 | 0.492 | 0.139 | 162.7 |
| 7 | 0.083 | 0 | 277.9 |

## In these collections

- [Green gradients](https://grabient.com/green-gradients)
- [Black Friday gradients](https://grabient.com/black-friday-gradients)

## Other forms

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