# Near-black and sage color palette

The Near-black and sage color palette brings together dark gray, green, yellow, and dark green. The colors span a narrow lightness range, combining restrained color with gentle contrast. Its dark and grounded character suits brand mood boards and editorial graphics. Its darkest tone is dark gray, and its lightest tone is yellow.

- Also called: Seamless black and brown radial gradient
- Seed: `kYMARrIIa9qqNvqwED9JgpAxsDRA`
- Page: https://grabient.com/kYMARrIIa9qqNvqwED9JgpAxsDRA?style=radialGradient&steps=32&angle=270
- Drawn as: radial gradient, 32 steps, 270 degrees
- Kinds: neutral, dark, seamless
- Hues: monochromatic
- Contrast of its darkest and lightest colors: 1.8 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 | `#121412` | `oklch(18.90% 0.0055 150.47)` | Dark Veil | white, 18.4 to 1 |
| 2 | `#131613` | `oklch(19.58% 0.0067 148.39)` | Distinctive Lack of Hue | white, 18.2 to 1 |
| 3 | `#151815` | `oklch(20.52% 0.0084 145.44)` | Cynical Black | white, 17.8 to 1 |
| 4 | `#171b17` | `oklch(21.63% 0.0103 141.98)` | Twilight Zone | white, 17.4 to 1 |
| 5 | `#1a1e18` | `oklch(22.86% 0.0125 138.35)` | Coco’s Black | white, 16.8 to 1 |
| 6 | `#1d211a` | `oklch(24.12% 0.0149 134.88)` | Underworld | white, 16.3 to 1 |
| 7 | `#1f241c` | `oklch(25.35% 0.0174 131.94)` | Underworld | white, 15.7 to 1 |
| 8 | `#22271d` | `oklch(26.57% 0.0202 129.63)` | Underworld | white, 15.1 to 1 |
| 9 | `#252b1f` | `oklch(27.90% 0.0234 127.60)` | Quartzite | white, 14.5 to 1 |
| 10 | `#292f20` | `oklch(29.26% 0.0269 125.81)` | Pine Tree | white, 13.8 to 1 |
| 11 | `#2c3221` | `oklch(30.62% 0.0303 124.20)` | Rangitoto | white, 13.2 to 1 |
| 12 | `#2f3522` | `oklch(31.90% 0.0336 122.74)` | Fuchsia Berries | white, 12.6 to 1 |
| 13 | `#323923` | `oklch(33.05% 0.0363 121.40)` | Matcha Ash | white, 12 to 1 |
| 14 | `#353b24` | `oklch(34.08% 0.0385 120.11)` | Green Kelp | white, 11.6 to 1 |
| 15 | `#383e25` | `oklch(35.14% 0.0404 118.83)` | Green Kelp | white, 11.1 to 1 |
| 16 | `#3c4127` | `oklch(36.15% 0.0422 117.64)` | Deep Seaweed | white, 10.6 to 1 |
| 17 | `#3e4328` | `oklch(37.02% 0.0435 116.65)` | Mallardish | white, 10.3 to 1 |
| 18 | `#404429` | `oklch(37.63% 0.0443 115.93)` | Strong Tone Wash | white, 10 to 1 |
| 19 | `#414529` | `oklch(37.87% 0.0444 115.58)` | Tin Bitz | white, 9.9 to 1 |
| 20 | `#404429` | `oklch(37.63% 0.0437 115.66)` | Strong Tone Wash | white, 10 to 1 |
| 21 | `#3e4228` | `oklch(36.86% 0.0420 115.87)` | Deep Seaweed | white, 10.3 to 1 |
| 22 | `#3b3f27` | `oklch(35.67% 0.0395 116.28)` | Deep Seaweed | white, 10.9 to 1 |
| 23 | `#373b25` | `oklch(34.21% 0.0365 117.08)` | Green Kelp | white, 11.5 to 1 |
| 24 | `#333723` | `oklch(32.63% 0.0333 118.46)` | Fuchsia Berries | white, 12.2 to 1 |
| 25 | `#2e3322` | `oklch(31.06% 0.0300 120.60)` | Rangitoto | white, 13 to 1 |
| 26 | `#2a2f20` | `oklch(29.65% 0.0270 123.72)` | Pine Tree | white, 13.7 to 1 |
| 27 | `#262c1f` | `oklch(28.16% 0.0237 128.54)` | Quartzite | white, 14.4 to 1 |
| 28 | `#21281e` | `oklch(26.55% 0.0201 134.75)` | Kuro Green | white, 15.1 to 1 |
| 29 | `#1d241c` | `oklch(24.94% 0.0165 141.58)` | Underworld | white, 15.9 to 1 |
| 30 | `#1a201a` | `oklch(23.44% 0.0132 148.23)` | Black Emerald | white, 16.6 to 1 |
| 31 | `#171c19` | `oklch(22.17% 0.0103 153.92)` | Coco’s Black | white, 17.1 to 1 |
| 32 | `#161a17` | `oklch(21.26% 0.0083 157.87)` | Twilight Zone | white, 17.5 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #121412 0.0%, #131613 3.2%, #151815 6.5%, #171b17 9.7%, #1a1e18 12.9%, #1d211a 16.1%, #1f241c 19.4%, #22271d 22.6%, #252b1f 25.8%, #292f20 29.0%, #2c3221 32.3%, #2f3522 35.5%, #323923 38.7%, #353b24 41.9%, #383e25 45.2%, #3c4127 48.4%, #3e4328 51.6%, #404429 54.8%, #414529 58.1%, #404429 61.3%, #3e4228 64.5%, #3b3f27 67.7%, #373b25 71.0%, #333723 74.2%, #2e3322 77.4%, #2a2f20 80.6%, #262c1f 83.9%, #21281e 87.1%, #1d241c 90.3%, #1a201a 93.5%, #171c19 96.8%, #161a17 100.0%);
background: radial-gradient(circle at 50% 50% in oklch, oklch(18.90% 0.0055 150.47) 0.0%, oklch(19.58% 0.0067 148.39) 3.2%, oklch(20.52% 0.0084 145.44) 6.5%, oklch(21.63% 0.0103 141.98) 9.7%, oklch(22.86% 0.0125 138.35) 12.9%, oklch(24.12% 0.0149 134.88) 16.1%, oklch(25.35% 0.0174 131.94) 19.4%, oklch(26.57% 0.0202 129.63) 22.6%, oklch(27.90% 0.0234 127.60) 25.8%, oklch(29.26% 0.0269 125.81) 29.0%, oklch(30.62% 0.0303 124.20) 32.3%, oklch(31.90% 0.0336 122.74) 35.5%, oklch(33.05% 0.0363 121.40) 38.7%, oklch(34.08% 0.0385 120.11) 41.9%, oklch(35.14% 0.0404 118.83) 45.2%, oklch(36.15% 0.0422 117.64) 48.4%, oklch(37.02% 0.0435 116.65) 51.6%, oklch(37.63% 0.0443 115.93) 54.8%, oklch(37.87% 0.0444 115.58) 58.1%, oklch(37.63% 0.0437 115.66) 61.3%, oklch(36.86% 0.0420 115.87) 64.5%, oklch(35.67% 0.0395 116.28) 67.7%, oklch(34.21% 0.0365 117.08) 71.0%, oklch(32.63% 0.0333 118.46) 74.2%, oklch(31.06% 0.0300 120.60) 77.4%, oklch(29.65% 0.0270 123.72) 80.6%, oklch(28.16% 0.0237 128.54) 83.9%, oklch(26.55% 0.0201 134.75) 87.1%, oklch(24.94% 0.0165 141.58) 90.3%, oklch(23.44% 0.0132 148.23) 93.5%, oklch(22.17% 0.0103 153.92) 96.8%, oklch(21.26% 0.0083 157.87) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.189 | 0.006 | 150.5 |
| 2 | 0.256 | 0.018 | 131.4 |
| 3 | 0.335 | 0.037 | 120.9 |
| 4 | 0.378 | 0.044 | 115.6 |
| 5 | 0.299 | 0.028 | 123 |
| 6 | 0.213 | 0.008 | 157.9 |

## In these collections

- [Muted gradients](https://grabient.com/muted-gradients)
- [Dark muted gradients](https://grabient.com/dark-muted-gradients)

## Other forms

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