# Sage, deep teal and near-black color palette

The Sage, deep teal and near-black color palette brings together green, dark green, and dark teal. The colors span a moderate lightness range, combining moderate color with clear contrast. Its balanced and composed character suits botanical branding and garden event graphics. Its darkest tone is dark teal, and its lightest tone is green.

- Also called: Monochrome green to black linear gradient
- Seed: `kUkzprtqLBCYZwQYDsDA`
- Page: https://grabient.com/kUkzprtqLBCYZwQYDsDA?steps=32&angle=180
- Drawn as: linear gradient, 32 steps, 180 degrees
- Kinds: light to dark, vivid, dark, cool, monochrome
- Hues: analogous
- Contrast of its darkest and lightest colors: 4.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 | `#558862` | `oklch(57.87% 0.0799 151.17)` | Spring Garden | black, 5 to 1 |
| 2 | `#51855f` | `oklch(57.01% 0.0810 151.72)` | Soylent Green | black, 4.8 to 1 |
| 3 | `#4c825c` | `oklch(55.89% 0.0825 152.41)` | Leisure Green | black, 4.6 to 1 |
| 4 | `#467f59` | `oklch(54.57% 0.0844 153.24)` | Leisure Green | white, 4.7 to 1 |
| 5 | `#407b55` | `oklch(53.08% 0.0865 154.16)` | Rokushō Green | white, 5 to 1 |
| 6 | `#387651` | `oklch(51.48% 0.0887 155.16)` | Grasslands | white, 5.3 to 1 |
| 7 | `#30724d` | `oklch(49.81% 0.0908 156.21)` | Parsley Sprig | white, 5.7 to 1 |
| 8 | `#276d49` | `oklch(48.12% 0.0926 157.28)` | Precious Emerald | white, 6.2 to 1 |
| 9 | `#1d6945` | `oklch(46.45% 0.0941 158.35)` | Jade Mussel Green | white, 6.6 to 1 |
| 10 | `#136441` | `oklch(44.86% 0.0950 159.39)` | Fun Green | white, 7.1 to 1 |
| 11 | `#06603f` | `oklch(43.37% 0.0952 160.37)` | Spruce | white, 7.5 to 1 |
| 12 | `#005c3c` | `oklch(42.02% 0.0932 161.27)` | Spruce | white, 8 to 1 |
| 13 | `#00583b` | `oklch(40.69% 0.0890 162.21)` | Sacramento State Green | white, 8.5 to 1 |
| 14 | `#005439` | `oklch(39.38% 0.0849 163.16)` | Permanent Green | white, 9 to 1 |
| 15 | `#005037` | `oklch(38.08% 0.0810 164.11)` | Chrysocolla Dark Green | white, 9.5 to 1 |
| 16 | `#004c35` | `oklch(36.81% 0.0773 165.06)` | Chrysocolla Dark Green | white, 10.1 to 1 |
| 17 | `#004833` | `oklch(35.55% 0.0738 166.00)` | Zucchini | white, 10.6 to 1 |
| 18 | `#004431` | `oklch(34.31% 0.0704 166.93)` | UP Forest Green | white, 11.2 to 1 |
| 19 | `#00402f` | `oklch(33.09% 0.0671 167.84)` | UP Forest Green | white, 11.7 to 1 |
| 20 | `#003d2d` | `oklch(31.89% 0.0640 168.72)` | Deep Fir | white, 12.3 to 1 |
| 21 | `#00392b` | `oklch(30.71% 0.0611 169.58)` | Off-Road Green | white, 12.9 to 1 |
| 22 | `#003628` | `oklch(29.54% 0.0582 170.40)` | Coach Green | white, 13.5 to 1 |
| 23 | `#003226` | `oklch(28.33% 0.0554 171.23)` | Pitch-Black Forests | white, 14.1 to 1 |
| 24 | `#002f24` | `oklch(27.09% 0.0525 172.07)` | Dark Jungle | white, 14.7 to 1 |
| 25 | `#002b21` | `oklch(25.84% 0.0497 172.91)` | Bush | white, 15.3 to 1 |
| 26 | `#00281f` | `oklch(24.61% 0.0469 173.72)` | Deep Slate Green | white, 15.9 to 1 |
| 27 | `#00251c` | `oklch(23.42% 0.0443 174.50)` | Deep Slate Green | white, 16.4 to 1 |
| 28 | `#00211a` | `oklch(22.29% 0.0419 175.23)` | Stellar Explorer | white, 16.9 to 1 |
| 29 | `#001f18` | `oklch(21.25% 0.0398 175.90)` | Stellar Explorer | white, 17.4 to 1 |
| 30 | `#001c16` | `oklch(20.33% 0.0379 176.50)` | Pinch of Pepper | white, 17.7 to 1 |
| 31 | `#001a15` | `oklch(19.54% 0.0362 177.00)` | Pinch of Pepper | white, 18.1 to 1 |
| 32 | `#001913` | `oklch(18.92% 0.0350 177.40)` | Pinch of Pepper | white, 18.3 to 1 |

## CSS

```css
background: linear-gradient(180deg, #558862 0.0%, #51855f 3.2%, #4c825c 6.5%, #467f59 9.7%, #407b55 12.9%, #387651 16.1%, #30724d 19.4%, #276d49 22.6%, #1d6945 25.8%, #136441 29.0%, #06603f 32.3%, #005c3c 35.5%, #00583b 38.7%, #005439 41.9%, #005037 45.2%, #004c35 48.4%, #004833 51.6%, #004431 54.8%, #00402f 58.1%, #003d2d 61.3%, #00392b 64.5%, #003628 67.7%, #003226 71.0%, #002f24 74.2%, #002b21 77.4%, #00281f 80.6%, #00251c 83.9%, #00211a 87.1%, #001f18 90.3%, #001c16 93.5%, #001a15 96.8%, #001913 100.0%);
background: linear-gradient(180deg in oklch, oklch(57.87% 0.0799 151.17) 0.0%, oklch(57.01% 0.0810 151.72) 3.2%, oklch(55.89% 0.0825 152.41) 6.5%, oklch(54.57% 0.0844 153.24) 9.7%, oklch(53.08% 0.0865 154.16) 12.9%, oklch(51.48% 0.0887 155.16) 16.1%, oklch(49.81% 0.0908 156.21) 19.4%, oklch(48.12% 0.0926 157.28) 22.6%, oklch(46.45% 0.0941 158.35) 25.8%, oklch(44.86% 0.0950 159.39) 29.0%, oklch(43.37% 0.0952 160.37) 32.3%, oklch(42.02% 0.0932 161.27) 35.5%, oklch(40.69% 0.0890 162.21) 38.7%, oklch(39.38% 0.0849 163.16) 41.9%, oklch(38.08% 0.0810 164.11) 45.2%, oklch(36.81% 0.0773 165.06) 48.4%, oklch(35.55% 0.0738 166.00) 51.6%, oklch(34.31% 0.0704 166.93) 54.8%, oklch(33.09% 0.0671 167.84) 58.1%, oklch(31.89% 0.0640 168.72) 61.3%, oklch(30.71% 0.0611 169.58) 64.5%, oklch(29.54% 0.0582 170.40) 67.7%, oklch(28.33% 0.0554 171.23) 71.0%, oklch(27.09% 0.0525 172.07) 74.2%, oklch(25.84% 0.0497 172.91) 77.4%, oklch(24.61% 0.0469 173.72) 80.6%, oklch(23.42% 0.0443 174.50) 83.9%, oklch(22.29% 0.0419 175.23) 87.1%, oklch(21.25% 0.0398 175.90) 90.3%, oklch(20.33% 0.0379 176.50) 93.5%, oklch(19.54% 0.0362 177.00) 96.8%, oklch(18.92% 0.0350 177.40) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.579 | 0.08 | 151.2 |
| 2 | 0.429 | 0.095 | 160.7 |
| 3 | 0.299 | 0.07 | 170.2 |
| 4 | 0.189 | 0.04 | 177.6 |

## In these collections

- [Forest gradients](https://grabient.com/forest-gradients)
- [Weathered garden gradients](https://grabient.com/weathered-garden-gradients)
- [Earth tone gradients](https://grabient.com/earth-tone-gradients)

## Other forms

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