# Emerald and chartreuse angular gradient

Deep pine green rises through emerald and bright green into vivid chartreuse, then returns through softer green to its dark pine beginning. The angular composition combines a luminous yellow-green accent with a substantial dark anchor. It suits energetic website heroes, outdoor event graphics, environmental campaigns, and fresh digital product presentations.

- Also called: Seamless dark green and green angular gradient
- Seed: `kUPhZ5S64_OxLO8fC0TA`
- Page: https://grabient.com/kUPhZ5S64_OxLO8fC0TA?style=angularGradient&steps=24&angle=135
- Drawn as: angular gradient, 24 steps, 135 degrees
- Kinds: light center, vivid, monochrome, seamless
- Hues: analogous
- Contrast of its darkest and lightest colors: 11 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 | `#10251e` | `oklch(24.41% 0.0303 170.16)` | Deep Slate Green | white, 16 to 1 |
| 2 | `#112d24` | `oklch(27.32% 0.0383 169.85)` | Guerrilla Forest | white, 14.6 to 1 |
| 3 | `#12392d` | `oklch(31.29% 0.0490 169.67)` | Deep Fir | white, 12.7 to 1 |
| 4 | `#124738` | `oklch(36.02% 0.0618 169.46)` | Sherwood Green | white, 10.5 to 1 |
| 5 | `#105844` | `oklch(41.22% 0.0760 169.08)` | Billiard Table | white, 8.4 to 1 |
| 6 | `#0b6a50` | `oklch(46.58% 0.0906 168.38)` | Peacock Green | white, 6.6 to 1 |
| 7 | `#037b5c` | `oklch(51.81% 0.1051 167.21)` | Emerald Dream | white, 5.2 to 1 |
| 8 | `#008c65` | `oklch(56.63% 0.1184 165.41)` | Kabalite Green | black, 4.9 to 1 |
| 9 | `#069a6b` | `oklch(60.83% 0.1308 162.80)` | Rainforest | black, 5.8 to 1 |
| 10 | `#1dab6f` | `oklch(65.54% 0.1449 158.49)` | Banaue Jade | black, 7 to 1 |
| 11 | `#39bc6e` | `oklch(70.71% 0.1606 152.85)` | Times Square Screens | black, 8.6 to 1 |
| 12 | `#56cd69` | `oklch(75.84% 0.1764 146.57)` | UFO Green | black, 10.3 to 1 |
| 13 | `#74dc5e` | `oklch(80.41% 0.1906 140.35)` | Lightish Green | black, 12.1 to 1 |
| 14 | `#8de650` | `oklch(83.90% 0.2018 134.87)` | Kiwi Green | black, 13.5 to 1 |
| 15 | `#9fea41` | `oklch(85.82% 0.2082 130.85)` | Kiwi Pulp | black, 14.3 to 1 |
| 16 | `#a5e938` | `oklch(85.65% 0.2083 128.97)` | Kiwi Pulp | black, 14.2 to 1 |
| 17 | `#9ade3a` | `oklch(82.68% 0.2000 129.91)` | Poisonous Potion | black, 12.9 to 1 |
| 18 | `#81ca44` | `oklch(76.48% 0.1822 133.60)` | Midsummer Field | black, 10.4 to 1 |
| 19 | `#60ae4a` | `oklch(67.94% 0.1573 139.28)` | Barnyard Grass | black, 7.6 to 1 |
| 20 | `#408e49` | `oklch(58.04% 0.1285 146.16)` | Park Picnic | black, 5.1 to 1 |
| 21 | `#266d42` | `oklch(47.76% 0.0985 153.47)` | Billiard Ball | white, 6.2 to 1 |
| 22 | `#194e36` | `oklch(38.07% 0.0702 160.43)` | Order Green | white, 9.6 to 1 |
| 23 | `#133528` | `oklch(29.97% 0.0465 166.25)` | Pumpkin Green Black | white, 13.3 to 1 |
| 24 | `#10251e` | `oklch(24.41% 0.0303 170.16)` | Deep Slate Green | white, 16 to 1 |

## CSS

```css
background: conic-gradient(from 135deg, #10251e 0.0%, #112d24 4.3%, #12392d 8.7%, #124738 13.0%, #105844 17.4%, #0b6a50 21.7%, #037b5c 26.1%, #008c65 30.4%, #069a6b 34.8%, #1dab6f 39.1%, #39bc6e 43.5%, #56cd69 47.8%, #74dc5e 52.2%, #8de650 56.5%, #9fea41 60.9%, #a5e938 65.2%, #9ade3a 69.6%, #81ca44 73.9%, #60ae4a 78.3%, #408e49 82.6%, #266d42 87.0%, #194e36 91.3%, #133528 95.7%, #10251e 100.0%);
background: conic-gradient(from 135deg in oklch, oklch(24.41% 0.0303 170.16) 0.0%, oklch(27.32% 0.0383 169.85) 4.3%, oklch(31.29% 0.0490 169.67) 8.7%, oklch(36.02% 0.0618 169.46) 13.0%, oklch(41.22% 0.0760 169.08) 17.4%, oklch(46.58% 0.0906 168.38) 21.7%, oklch(51.81% 0.1051 167.21) 26.1%, oklch(56.63% 0.1184 165.41) 30.4%, oklch(60.83% 0.1308 162.80) 34.8%, oklch(65.54% 0.1449 158.49) 39.1%, oklch(70.71% 0.1606 152.85) 43.5%, oklch(75.84% 0.1764 146.57) 47.8%, oklch(80.41% 0.1906 140.35) 52.2%, oklch(83.90% 0.2018 134.87) 56.5%, oklch(85.82% 0.2082 130.85) 60.9%, oklch(85.65% 0.2083 128.97) 65.2%, oklch(82.68% 0.2000 129.91) 69.6%, oklch(76.48% 0.1822 133.60) 73.9%, oklch(67.94% 0.1573 139.28) 78.3%, oklch(58.04% 0.1285 146.16) 82.6%, oklch(47.76% 0.0985 153.47) 87.0%, oklch(38.07% 0.0702 160.43) 91.3%, oklch(29.97% 0.0465 166.25) 95.7%, oklch(24.41% 0.0303 170.16) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.244 | 0.03 | 170.2 |
| 2 | 0.594 | 0.127 | 163.8 |
| 3 | 0.85 | 0.207 | 128.9 |
| 4 | 0.244 | 0.03 | 170.2 |

## In these collections

- [Hero section gradients](https://grabient.com/hero-section-gradients)

## Other forms

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