# Storm navy ochre and rainlit clay

Storm navy opens through muted teal and olive into ochre, brightens through pale green-gray to rain gray, then returns through sage toward warm clay. This sixty-four-stop angular gradient forms a southern spring rain palette with cool shadows and earthy light. The broad pale passage separates its ochre field colors from the quieter clay-colored ending.

- Also called: Navy, tan, gray and brown angular gradient
- Seed: `kWQRi1SJk1NspNdqhNESyArI`
- Page: https://grabient.com/kWQRi1SJk1NspNdqhNESyArI?style=angularGradient&steps=64&angle=225
- Drawn as: angular gradient, 64 steps, 225 degrees
- Kinds: light center, multicolor
- Hues: wide
- Contrast of its darkest and lightest colors: 9.7 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 | `#182433` | `oklch(25.59% 0.0331 254.53)` | Dark | white, 15.7 to 1 |
| 2 | `#192736` | `oklch(26.75% 0.0343 251.28)` | Abyssal Anchorfish Blue | white, 15.1 to 1 |
| 3 | `#1b2b3a` | `oklch(28.19% 0.0358 247.35)` | Oceanic Noir | white, 14.4 to 1 |
| 4 | `#1c303f` | `oklch(29.87% 0.0375 242.82)` | Tangaroa | white, 13.6 to 1 |
| 5 | `#1e3544` | `oklch(31.77% 0.0394 237.75)` | Blue Whale | white, 12.7 to 1 |
| 6 | `#203b49` | `oklch(33.84% 0.0415 232.22)` | Subterranean River | white, 11.7 to 1 |
| 7 | `#22424f` | `oklch(36.05% 0.0437 226.31)` | Green Vogue | white, 10.7 to 1 |
| 8 | `#244954` | `oklch(38.36% 0.0461 220.08)` | Mallard | white, 9.7 to 1 |
| 9 | `#27515a` | `oklch(40.73% 0.0485 213.62)` | Sunken Mystery | white, 8.7 to 1 |
| 10 | `#2a585e` | `oklch(43.12% 0.0511 207.00)` | Sea Challenge | white, 7.8 to 1 |
| 11 | `#2e6063` | `oklch(45.50% 0.0537 200.29)` | Calypso Green | white, 7 to 1 |
| 12 | `#336766` | `oklch(47.83% 0.0563 193.56)` | Magnetic Green | white, 6.3 to 1 |
| 13 | `#386f69` | `oklch(50.08% 0.0590 186.89)` | Deep Pool Teal | white, 5.7 to 1 |
| 14 | `#3e756b` | `oklch(52.20% 0.0617 180.35)` | Green Sleeves | white, 5.2 to 1 |
| 15 | `#447c6c` | `oklch(54.16% 0.0644 174.02)` | Leaping Lizard | white, 4.8 to 1 |
| 16 | `#4a816d` | `oklch(55.92% 0.0670 167.96)` | Blackberry Leaf Green | black, 4.6 to 1 |
| 17 | `#51866c` | `oklch(57.45% 0.0696 162.22)` | Herb Blend | black, 4.9 to 1 |
| 18 | `#588a6b` | `oklch(58.82% 0.0725 156.01)` | Saltwater Depth | black, 5.2 to 1 |
| 19 | `#608d68` | `oklch(60.08% 0.0760 149.13)` | Murdoch | black, 5.5 to 1 |
| 20 | `#689063` | `oklch(61.23% 0.0799 141.75)` | English Ivy | black, 5.7 to 1 |
| 21 | `#72925e` | `oklch(62.30% 0.0840 134.05)` | Bland Celery | black, 6 to 1 |
| 22 | `#7c9458` | `oklch(63.28% 0.0883 126.19)` | Vegetarian Veteran | black, 6.2 to 1 |
| 23 | `#879551` | `oklch(64.20% 0.0927 118.36)` | Bold Avocado | black, 6.4 to 1 |
| 24 | `#92954b` | `oklch(65.06% 0.0969 110.72)` | Winter Pea Green | black, 6.6 to 1 |
| 25 | `#9d9546` | `oklch(65.88% 0.1010 103.45)` | Lentil Sprout | black, 6.7 to 1 |
| 26 | `#a79442` | `oklch(66.66% 0.1047 96.72)` | 18th Century Green | black, 6.9 to 1 |
| 27 | `#b09440` | `oklch(67.41% 0.1080 90.70)` | Balsam Pear | black, 7.1 to 1 |
| 28 | `#b8933f` | `oklch(68.16% 0.1107 85.57)` | Roti | black, 7.2 to 1 |
| 29 | `#be9340` | `oklch(68.90% 0.1128 81.49)` | Wheat Beer | black, 7.4 to 1 |
| 30 | `#c49442` | `oklch(69.65% 0.1140 78.64)` | Narcissus | black, 7.6 to 1 |
| 31 | `#c79645` | `oklch(70.43% 0.1144 77.20)` | Nattō | black, 7.8 to 1 |
| 32 | `#ca9848` | `oklch(71.23% 0.1137 77.34)` | Gingerbread House | black, 8.1 to 1 |
| 33 | `#ca9c4c` | `oklch(72.09% 0.1119 79.38)` | Creole Mustard | black, 8.3 to 1 |
| 34 | `#c8a252` | `oklch(73.06% 0.1083 84.18)` | Sauterne | black, 8.7 to 1 |
| 35 | `#c3a95a` | `oklch(74.12% 0.1033 91.49)` | Hedgehog Cactus Yellow Green | black, 9.1 to 1 |
| 36 | `#bcb166` | `oklch(75.24% 0.0970 100.89)` | Straw Hut | black, 9.5 to 1 |
| 37 | `#b3b875` | `oklch(76.39% 0.0897 111.96)` | Green Curry | black, 10 to 1 |
| 38 | `#abbf86` | `oklch(77.56% 0.0816 124.28)` | Shrubbery | black, 10.5 to 1 |
| 39 | `#a4c597` | `oklch(78.71% 0.0730 137.42)` | Gingko | black, 11 to 1 |
| 40 | `#a0c9a8` | `oklch(79.82% 0.0641 150.96)` | French Market | black, 11.4 to 1 |
| 41 | `#a0ccb7` | `oklch(80.86% 0.0552 164.48)` | Calculus | black, 11.8 to 1 |
| 42 | `#a4cec3` | `oklch(81.80% 0.0465 177.55)` | Phosphorus | black, 12.1 to 1 |
| 43 | `#abcfcb` | `oklch(82.62% 0.0382 189.76)` | Blue Angora | black, 12.4 to 1 |
| 44 | `#b2cfd0` | `oklch(83.29% 0.0307 200.67)` | Turquoise Grey | black, 12.7 to 1 |
| 45 | `#b9ced2` | `oklch(83.78% 0.0241 209.87)` | Shhh… | black, 12.8 to 1 |
| 46 | `#beced3` | `oklch(84.08% 0.0188 216.93)` | Shhh… | black, 12.9 to 1 |
| 47 | `#c1cdd2` | `oklch(84.14% 0.0149 221.44)` | New North | black, 12.9 to 1 |
| 48 | `#c2ccd0` | `oklch(83.95% 0.0127 222.96)` | New North | black, 12.8 to 1 |
| 49 | `#c1cbce` | `oklch(83.45% 0.0123 221.20)` | Stone Golem | black, 12.6 to 1 |
| 50 | `#bdc8cc` | `oklch(82.59% 0.0135 216.43)` | Hazy Blue | black, 12.3 to 1 |
| 51 | `#b7c5c8` | `oklch(81.42% 0.0161 209.04)` | Trade Winds | black, 11.8 to 1 |
| 52 | `#b0c2c2` | `oklch(79.97% 0.0199 199.40)` | Degas Blue | black, 11.3 to 1 |
| 53 | `#a7bebb` | `oklch(78.31% 0.0247 187.90)` | Sweetest Damask | black, 10.7 to 1 |
| 54 | `#a0b9b1` | `oklch(76.48% 0.0303 174.93)` | Opal Silk | black, 10 to 1 |
| 55 | `#99b4a5` | `oklch(74.52% 0.0365 160.85)` | Nile River | black, 9.4 to 1 |
| 56 | `#95ae96` | `oklch(72.48% 0.0432 146.05)` | Nurture Green | black, 8.7 to 1 |
| 57 | `#95a786` | `oklch(70.41% 0.0500 130.91)` | Huntington Garden | black, 8.1 to 1 |
| 58 | `#979e76` | `oklch(68.36% 0.0569 115.81)` | Renkon Beige | black, 7.4 to 1 |
| 59 | `#9b9567` | `oklch(66.37% 0.0637 101.14)` | Green Lentils | black, 6.8 to 1 |
| 60 | `#a08b5b` | `oklch(64.49% 0.0701 87.27)` | Shank | black, 6.3 to 1 |
| 61 | `#a48253` | `oklch(62.77% 0.0759 74.58)` | Lavish Gold | black, 5.8 to 1 |
| 62 | `#a7794f` | `oklch(61.26% 0.0810 63.45)` | Apple Cinnamon | black, 5.4 to 1 |
| 63 | `#a8724e` | `oklch(60.01% 0.0852 54.27)` | Bran | black, 5.1 to 1 |
| 64 | `#a86d4e` | `oklch(59.06% 0.0882 47.41)` | Smouldering Copper | black, 4.9 to 1 |

## CSS

```css
background: conic-gradient(from 225deg, #182433 0.0%, #192736 1.6%, #1b2b3a 3.2%, #1c303f 4.8%, #1e3544 6.3%, #203b49 7.9%, #22424f 9.5%, #244954 11.1%, #27515a 12.7%, #2a585e 14.3%, #2e6063 15.9%, #336766 17.5%, #386f69 19.0%, #3e756b 20.6%, #447c6c 22.2%, #4a816d 23.8%, #51866c 25.4%, #588a6b 27.0%, #608d68 28.6%, #689063 30.2%, #72925e 31.7%, #7c9458 33.3%, #879551 34.9%, #92954b 36.5%, #9d9546 38.1%, #a79442 39.7%, #b09440 41.3%, #b8933f 42.9%, #be9340 44.4%, #c49442 46.0%, #c79645 47.6%, #ca9848 49.2%, #ca9c4c 50.8%, #c8a252 52.4%, #c3a95a 54.0%, #bcb166 55.6%, #b3b875 57.1%, #abbf86 58.7%, #a4c597 60.3%, #a0c9a8 61.9%, #a0ccb7 63.5%, #a4cec3 65.1%, #abcfcb 66.7%, #b2cfd0 68.3%, #b9ced2 69.8%, #beced3 71.4%, #c1cdd2 73.0%, #c2ccd0 74.6%, #c1cbce 76.2%, #bdc8cc 77.8%, #b7c5c8 79.4%, #b0c2c2 81.0%, #a7bebb 82.5%, #a0b9b1 84.1%, #99b4a5 85.7%, #95ae96 87.3%, #95a786 88.9%, #979e76 90.5%, #9b9567 92.1%, #a08b5b 93.7%, #a48253 95.2%, #a7794f 96.8%, #a8724e 98.4%, #a86d4e 100.0%);
background: conic-gradient(from 225deg in oklch, oklch(25.59% 0.0331 254.53) 0.0%, oklch(26.75% 0.0343 251.28) 1.6%, oklch(28.19% 0.0358 247.35) 3.2%, oklch(29.87% 0.0375 242.82) 4.8%, oklch(31.77% 0.0394 237.75) 6.3%, oklch(33.84% 0.0415 232.22) 7.9%, oklch(36.05% 0.0437 226.31) 9.5%, oklch(38.36% 0.0461 220.08) 11.1%, oklch(40.73% 0.0485 213.62) 12.7%, oklch(43.12% 0.0511 207.00) 14.3%, oklch(45.50% 0.0537 200.29) 15.9%, oklch(47.83% 0.0563 193.56) 17.5%, oklch(50.08% 0.0590 186.89) 19.0%, oklch(52.20% 0.0617 180.35) 20.6%, oklch(54.16% 0.0644 174.02) 22.2%, oklch(55.92% 0.0670 167.96) 23.8%, oklch(57.45% 0.0696 162.22) 25.4%, oklch(58.82% 0.0725 156.01) 27.0%, oklch(60.08% 0.0760 149.13) 28.6%, oklch(61.23% 0.0799 141.75) 30.2%, oklch(62.30% 0.0840 134.05) 31.7%, oklch(63.28% 0.0883 126.19) 33.3%, oklch(64.20% 0.0927 118.36) 34.9%, oklch(65.06% 0.0969 110.72) 36.5%, oklch(65.88% 0.1010 103.45) 38.1%, oklch(66.66% 0.1047 96.72) 39.7%, oklch(67.41% 0.1080 90.70) 41.3%, oklch(68.16% 0.1107 85.57) 42.9%, oklch(68.90% 0.1128 81.49) 44.4%, oklch(69.65% 0.1140 78.64) 46.0%, oklch(70.43% 0.1144 77.20) 47.6%, oklch(71.23% 0.1137 77.34) 49.2%, oklch(72.09% 0.1119 79.38) 50.8%, oklch(73.06% 0.1083 84.18) 52.4%, oklch(74.12% 0.1033 91.49) 54.0%, oklch(75.24% 0.0970 100.89) 55.6%, oklch(76.39% 0.0897 111.96) 57.1%, oklch(77.56% 0.0816 124.28) 58.7%, oklch(78.71% 0.0730 137.42) 60.3%, oklch(79.82% 0.0641 150.96) 61.9%, oklch(80.86% 0.0552 164.48) 63.5%, oklch(81.80% 0.0465 177.55) 65.1%, oklch(82.62% 0.0382 189.76) 66.7%, oklch(83.29% 0.0307 200.67) 68.3%, oklch(83.78% 0.0241 209.87) 69.8%, oklch(84.08% 0.0188 216.93) 71.4%, oklch(84.14% 0.0149 221.44) 73.0%, oklch(83.95% 0.0127 222.96) 74.6%, oklch(83.45% 0.0123 221.20) 76.2%, oklch(82.59% 0.0135 216.43) 77.8%, oklch(81.42% 0.0161 209.04) 79.4%, oklch(79.97% 0.0199 199.40) 81.0%, oklch(78.31% 0.0247 187.90) 82.5%, oklch(76.48% 0.0303 174.93) 84.1%, oklch(74.52% 0.0365 160.85) 85.7%, oklch(72.48% 0.0432 146.05) 87.3%, oklch(70.41% 0.0500 130.91) 88.9%, oklch(68.36% 0.0569 115.81) 90.5%, oklch(66.37% 0.0637 101.14) 92.1%, oklch(64.49% 0.0701 87.27) 93.7%, oklch(62.77% 0.0759 74.58) 95.2%, oklch(61.26% 0.0810 63.45) 96.8%, oklch(60.01% 0.0852 54.27) 98.4%, oklch(59.06% 0.0882 47.41) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.256 | 0.033 | 254.5 |
| 2 | 0.571 | 0.069 | 163.7 |
| 3 | 0.717 | 0.113 | 78.1 |
| 4 | 0.839 | 0.012 | 222.8 |
| 5 | 0.591 | 0.088 | 47.4 |

## In these collections

- [Southern spring rain](https://grabient.com/southern-spring-rain)

## Other forms

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