# Near-black, deep cyan and ochre weather map

The Near-black, deep cyan and ochre weather map brings together dark gray, teal, green, and gold. The colors span a broad lightness range, combining moderate color with clear contrast. Its balanced and composed character suits information graphics and map mood boards. Its darkest tone is dark gray, and its lightest tone is gold.

- Also called: Black, teal, green and yellow linear gradient
- Seed: `kWKQ-9LxO5z2bvngMjbbDO84`
- Page: https://grabient.com/kWKQ-9LxO5z2bvngMjbbDO84?steps=32&angle=135
- Drawn as: linear gradient, 32 steps, 135 degrees
- Kinds: dark to light, vivid, multicolor
- Hues: wide
- Contrast of its darkest and lightest colors: 12.3 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 | `#090d17` | `oklch(16.14% 0.0207 265.78)` | Midnight Oil | white, 19.3 to 1 |
| 2 | `#0b111c` | `oklch(17.88% 0.0234 261.35)` | Midnight Edition | white, 18.8 to 1 |
| 3 | `#0e1723` | `oklch(20.28% 0.0271 255.13)` | Creeping Death | white, 17.9 to 1 |
| 4 | `#111f2b` | `oklch(23.14% 0.0316 247.71)` | The Count’s Black | white, 16.8 to 1 |
| 5 | `#132735` | `oklch(26.26% 0.0365 239.66)` | Abyssal Anchorfish Blue | white, 15.3 to 1 |
| 6 | `#14303e` | `oklch(29.45% 0.0415 231.59)` | NATO Blue | white, 13.7 to 1 |
| 7 | `#153946` | `oklch(32.52% 0.0464 224.07)` | Astral Nomad | white, 12.2 to 1 |
| 8 | `#16424d` | `oklch(35.27% 0.0508 217.69)` | Cold and Dark | white, 10.9 to 1 |
| 9 | `#164952` | `oklch(37.51% 0.0546 213.03)` | Midnight Green | white, 10 to 1 |
| 10 | `#174e57` | `oklch(39.21% 0.0575 210.44)` | Iron Teal | white, 9.2 to 1 |
| 11 | `#18525b` | `oklch(40.54% 0.0598 209.39)` | Recollection Blue | white, 8.7 to 1 |
| 12 | `#19555e` | `oklch(41.66% 0.0617 209.21)` | Uncharted | white, 8.3 to 1 |
| 13 | `#195962` | `oklch(42.73% 0.0637 209.24)` | Moonlit Pool | white, 7.9 to 1 |
| 14 | `#195c66` | `oklch(43.91% 0.0661 208.80)` | Tropical Skies | white, 7.5 to 1 |
| 15 | `#19616a` | `oklch(45.37% 0.0692 207.24)` | Peacock Tail | white, 7.1 to 1 |
| 16 | `#18676e` | `oklch(47.26% 0.0733 203.88)` | Kingfisher Bright | white, 6.5 to 1 |
| 17 | `#167073` | `oklch(49.77% 0.0788 198.06)` | Marine Wonder | white, 5.8 to 1 |
| 18 | `#167b76` | `oklch(52.96% 0.0861 189.66)` | Surfie Green | white, 5 to 1 |
| 19 | `#1f8878` | `oklch(56.65% 0.0949 179.38)` | Palm Springs Splash | black, 4.8 to 1 |
| 20 | `#329676` | `oklch(60.61% 0.1043 167.96)` | Ocean Green | black, 5.7 to 1 |
| 21 | `#4ba371` | `oklch(64.65% 0.1138 156.16)` | Tropical Tone | black, 6.7 to 1 |
| 22 | `#66ae69` | `oklch(68.53% 0.1228 144.72)` | Ferntastic | black, 7.8 to 1 |
| 23 | `#81b75f` | `oklch(72.04% 0.1306 134.38)` | Leafy Greens | black, 8.8 to 1 |
| 24 | `#98bd57` | `oklch(74.97% 0.1366 125.92)` | Happy Tune | black, 9.7 to 1 |
| 25 | `#aac251` | `oklch(77.24% 0.1405 119.57)` | Money Banks | black, 10.5 to 1 |
| 26 | `#b9c54e` | `oklch(79.11% 0.1427 114.44)` | Tropic Canary | black, 11.1 to 1 |
| 27 | `#c5c84d` | `oklch(80.64% 0.1437 110.32)` | Tansy | black, 11.7 to 1 |
| 28 | `#cfca4e` | `oklch(81.88% 0.1438 107.03)` | Salsa Verde | black, 12.1 to 1 |
| 29 | `#d6cb50` | `oklch(82.88% 0.1433 104.41)` | Advertisement Green | black, 12.5 to 1 |
| 30 | `#dccd52` | `oklch(83.71% 0.1426 102.28)` | Gold Deposit | black, 12.8 to 1 |
| 31 | `#e1ce54` | `oklch(84.41% 0.1420 100.47)` | Gold Deposit | black, 13.1 to 1 |
| 32 | `#e5cf55` | `oklch(85.04% 0.1419 98.81)` | Gamboge Yellow | black, 13.3 to 1 |

## CSS

```css
background: linear-gradient(135deg, #090d17 0.0%, #0b111c 3.2%, #0e1723 6.5%, #111f2b 9.7%, #132735 12.9%, #14303e 16.1%, #153946 19.4%, #16424d 22.6%, #164952 25.8%, #174e57 29.0%, #18525b 32.3%, #19555e 35.5%, #195962 38.7%, #195c66 41.9%, #19616a 45.2%, #18676e 48.4%, #167073 51.6%, #167b76 54.8%, #1f8878 58.1%, #329676 61.3%, #4ba371 64.5%, #66ae69 67.7%, #81b75f 71.0%, #98bd57 74.2%, #aac251 77.4%, #b9c54e 80.6%, #c5c84d 83.9%, #cfca4e 87.1%, #d6cb50 90.3%, #dccd52 93.5%, #e1ce54 96.8%, #e5cf55 100.0%);
background: linear-gradient(135deg in oklch, oklch(16.14% 0.0207 265.78) 0.0%, oklch(17.88% 0.0234 261.35) 3.2%, oklch(20.28% 0.0271 255.13) 6.5%, oklch(23.14% 0.0316 247.71) 9.7%, oklch(26.26% 0.0365 239.66) 12.9%, oklch(29.45% 0.0415 231.59) 16.1%, oklch(32.52% 0.0464 224.07) 19.4%, oklch(35.27% 0.0508 217.69) 22.6%, oklch(37.51% 0.0546 213.03) 25.8%, oklch(39.21% 0.0575 210.44) 29.0%, oklch(40.54% 0.0598 209.39) 32.3%, oklch(41.66% 0.0617 209.21) 35.5%, oklch(42.73% 0.0637 209.24) 38.7%, oklch(43.91% 0.0661 208.80) 41.9%, oklch(45.37% 0.0692 207.24) 45.2%, oklch(47.26% 0.0733 203.88) 48.4%, oklch(49.77% 0.0788 198.06) 51.6%, oklch(52.96% 0.0861 189.66) 54.8%, oklch(56.65% 0.0949 179.38) 58.1%, oklch(60.61% 0.1043 167.96) 61.3%, oklch(64.65% 0.1138 156.16) 64.5%, oklch(68.53% 0.1228 144.72) 67.7%, oklch(72.04% 0.1306 134.38) 71.0%, oklch(74.97% 0.1366 125.92) 74.2%, oklch(77.24% 0.1405 119.57) 77.4%, oklch(79.11% 0.1427 114.44) 80.6%, oklch(80.64% 0.1437 110.32) 83.9%, oklch(81.88% 0.1438 107.03) 87.1%, oklch(82.88% 0.1433 104.41) 90.3%, oklch(83.71% 0.1426 102.28) 93.5%, oklch(84.41% 0.1420 100.47) 96.8%, oklch(85.04% 0.1419 98.81) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.161 | 0.021 | 265.8 |
| 2 | 0.37 | 0.054 | 214 |
| 3 | 0.484 | 0.076 | 201.3 |
| 4 | 0.756 | 0.138 | 124.2 |
| 5 | 0.85 | 0.142 | 98.8 |

## In these collections

- [Weather map gradients](https://grabient.com/weather-map-gradients)

## Other forms

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