# Chartreuse Toasted Cocoa Passage

This linear gradient moves diagonally from pale chartreuse through yellow-green and olive, then settles into dark chocolate and toasted tan. The intermediate route stays earthy while preserving a clear shift from bright green to warm brown. It works for packaging, poster fields, editorial backgrounds, and interface panels that need both natural warmth and sharp contrast.

- Also called: Analogous green, olive and tan linear gradient
- Seed: `kW51lSXLxA7WavwvFzg3iDCI`
- Page: https://grabient.com/kW51lSXLxA7WavwvFzg3iDCI?steps=32&angle=135
- Drawn as: linear gradient, 32 steps, 135 degrees
- Kinds: dark center, vivid
- Hues: two-hue
- Contrast of its darkest and lightest colors: 9 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 | `#deeb8a` | `oklch(90.94% 0.1226 115.31)` | Sunny Lime | black, 16.3 to 1 |
| 2 | `#d8e782` | `oklch(89.59% 0.1270 116.10)` | Refreshed | black, 15.7 to 1 |
| 3 | `#d0e378` | `oklch(87.87% 0.1340 117.29)` | Idocrase Green | black, 14.9 to 1 |
| 4 | `#c7dd6b` | `oklch(85.83% 0.1423 118.70)` | Dry Seedlings | black, 14 to 1 |
| 5 | `#bcd75d` | `oklch(83.50% 0.1508 120.19)` | Frog Prince | black, 13 to 1 |
| 6 | `#b1d04f` | `oklch(80.93% 0.1584 121.59)` | Citrus Leaf | black, 11.9 to 1 |
| 7 | `#a5c840` | `oklch(78.13% 0.1640 122.76)` | Android Green | black, 10.9 to 1 |
| 8 | `#9abf33` | `oklch(75.16% 0.1664 123.54)` | Funky Frog | black, 9.8 to 1 |
| 9 | `#90b529` | `oklch(72.02% 0.1644 123.80)` | Outrageous Green | black, 8.8 to 1 |
| 10 | `#85a924` | `oklch(68.32% 0.1572 124.11)` | Avocado Green | black, 7.6 to 1 |
| 11 | `#799b24` | `oklch(64.07% 0.1460 124.52)` | Luminescent Green | black, 6.5 to 1 |
| 12 | `#6d8c25` | `oklch(59.54% 0.1320 124.75)` | Italian Buckthorn | black, 5.4 to 1 |
| 13 | `#637d26` | `oklch(54.96% 0.1167 124.54)` | Dirty Green | white, 4.7 to 1 |
| 14 | `#596e25` | `oklch(50.58% 0.1015 123.62)` | Loren Forest | white, 5.6 to 1 |
| 15 | `#526124` | `oklch(46.65% 0.0877 121.70)` | Basil Green | white, 6.7 to 1 |
| 16 | `#4d5721` | `oklch(43.41% 0.0769 118.52)` | Private Green | white, 7.8 to 1 |
| 17 | `#4a4e1e` | `oklch(40.99% 0.0700 113.62)` | Army Green | white, 8.7 to 1 |
| 18 | `#494719` | `oklch(38.89% 0.0654 106.07)` | Nori Seaweed Green | white, 9.5 to 1 |
| 19 | `#4a4014` | `oklch(37.10% 0.0625 96.56)` | Xanthophobia | white, 10.3 to 1 |
| 20 | `#4b3a11` | `oklch(35.72% 0.0611 86.00)` | Avocado Stone | white, 11 to 1 |
| 21 | `#4c3511` | `oklch(34.87% 0.0607 75.32)` | Bavarian Sweet Mustard | white, 11.4 to 1 |
| 22 | `#4f3213` | `oklch(34.65% 0.0611 65.43)` | Bavarian Sweet Mustard | white, 11.6 to 1 |
| 23 | `#533218` | `oklch(35.16% 0.0620 57.26)` | Dark Catacombs | white, 11.4 to 1 |
| 24 | `#59341d` | `oklch(36.52% 0.0631 51.72)` | Baker’s Chocolate | white, 10.8 to 1 |
| 25 | `#613a24` | `oklch(39.08% 0.0646 49.43)` | Tropical Wood Brown | white, 9.7 to 1 |
| 26 | `#6e452e` | `oklch(43.24% 0.0674 49.80)` | Pumpernickel | white, 8.2 to 1 |
| 27 | `#7f5338` | `oklch(48.53% 0.0711 52.13)` | Dachshund | white, 6.5 to 1 |
| 28 | `#926444` | `oklch(54.44% 0.0753 55.76)` | Copper Pot | white, 5 to 1 |
| 29 | `#a5764f` | `oklch(60.45% 0.0797 60.01)` | Leather Chair | black, 5.3 to 1 |
| 30 | `#b7875a` | `oklch(66.05% 0.0838 64.23)` | Deer | black, 6.6 to 1 |
| 31 | `#c59664` | `oklch(70.75% 0.0872 67.74)` | Chalet | black, 7.9 to 1 |
| 32 | `#d0a16b` | `oklch(74.02% 0.0896 69.87)` | Desert Caravan | black, 8.9 to 1 |

## CSS

```css
background: linear-gradient(135deg, #deeb8a 0.0%, #d8e782 3.2%, #d0e378 6.5%, #c7dd6b 9.7%, #bcd75d 12.9%, #b1d04f 16.1%, #a5c840 19.4%, #9abf33 22.6%, #90b529 25.8%, #85a924 29.0%, #799b24 32.3%, #6d8c25 35.5%, #637d26 38.7%, #596e25 41.9%, #526124 45.2%, #4d5721 48.4%, #4a4e1e 51.6%, #494719 54.8%, #4a4014 58.1%, #4b3a11 61.3%, #4c3511 64.5%, #4f3213 67.7%, #533218 71.0%, #59341d 74.2%, #613a24 77.4%, #6e452e 80.6%, #7f5338 83.9%, #926444 87.1%, #a5764f 90.3%, #b7875a 93.5%, #c59664 96.8%, #d0a16b 100.0%);
background: linear-gradient(135deg in oklch, oklch(90.94% 0.1226 115.31) 0.0%, oklch(89.59% 0.1270 116.10) 3.2%, oklch(87.87% 0.1340 117.29) 6.5%, oklch(85.83% 0.1423 118.70) 9.7%, oklch(83.50% 0.1508 120.19) 12.9%, oklch(80.93% 0.1584 121.59) 16.1%, oklch(78.13% 0.1640 122.76) 19.4%, oklch(75.16% 0.1664 123.54) 22.6%, oklch(72.02% 0.1644 123.80) 25.8%, oklch(68.32% 0.1572 124.11) 29.0%, oklch(64.07% 0.1460 124.52) 32.3%, oklch(59.54% 0.1320 124.75) 35.5%, oklch(54.96% 0.1167 124.54) 38.7%, oklch(50.58% 0.1015 123.62) 41.9%, oklch(46.65% 0.0877 121.70) 45.2%, oklch(43.41% 0.0769 118.52) 48.4%, oklch(40.99% 0.0700 113.62) 51.6%, oklch(38.89% 0.0654 106.07) 54.8%, oklch(37.10% 0.0625 96.56) 58.1%, oklch(35.72% 0.0611 86.00) 61.3%, oklch(34.87% 0.0607 75.32) 64.5%, oklch(34.65% 0.0611 65.43) 67.7%, oklch(35.16% 0.0620 57.26) 71.0%, oklch(36.52% 0.0631 51.72) 74.2%, oklch(39.08% 0.0646 49.43) 77.4%, oklch(43.24% 0.0674 49.80) 80.6%, oklch(48.53% 0.0711 52.13) 83.9%, oklch(54.44% 0.0753 55.76) 87.1%, oklch(60.45% 0.0797 60.01) 90.3%, oklch(66.05% 0.0838 64.23) 93.5%, oklch(70.75% 0.0872 67.74) 96.8%, oklch(74.02% 0.0896 69.87) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.909 | 0.123 | 115.3 |
| 2 | 0.728 | 0.165 | 123.8 |
| 3 | 0.421 | 0.073 | 116.4 |
| 4 | 0.37 | 0.063 | 50.9 |
| 5 | 0.74 | 0.09 | 69.9 |

## In these collections

- [Chocolate and chartreuse](https://grabient.com/chocolate-and-chartreuse)

## Other forms

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