# Blue Hour Tomato Vine

A diagonal gradient starts in deep blue-gray, crosses slate and violet, ripens through plum into tomato red and terracotta, then finishes in ochre and leaf green. Its cool-to-warm-to-green route evokes fruit emerging from evening shadow and works for food packaging, harvest posters, or broad editorial backgrounds.

- Also called: Navy, purple, red and brown linear gradient
- Seed: `kWTh62PxQ-76uz5RNkG0J9KA`
- Page: https://grabient.com/kWTh62PxQ-76uz5RNkG0J9KA?steps=32&angle=315
- Drawn as: linear gradient, 32 steps, 315 degrees
- Kinds: dark to light
- Hues: complementary
- Contrast of its darkest and lightest colors: 3.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 | `#223044` | `oklch(30.71% 0.0413 255.94)` | Crow Black | white, 13.2 to 1 |
| 2 | `#253549` | `oklch(32.36% 0.0420 254.24)` | Aeronautic | white, 12.5 to 1 |
| 3 | `#293b4f` | `oklch(34.72% 0.0425 250.88)` | Blue Fantastic | white, 11.4 to 1 |
| 4 | `#2e4357` | `oklch(37.54% 0.0429 246.83)` | Pickled Bluewood | white, 10.1 to 1 |
| 5 | `#344c5f` | `oklch(40.56% 0.0438 243.03)` | Ingénue Blue | white, 8.9 to 1 |
| 6 | `#3a5568` | `oklch(43.56% 0.0453 240.45)` | Summer Night | white, 7.8 to 1 |
| 7 | `#405d71` | `oklch(46.27% 0.0477 240.05)` | Superior Blue | white, 6.9 to 1 |
| 8 | `#45637a` | `oklch(48.46% 0.0514 242.79)` | Real Teal | white, 6.3 to 1 |
| 9 | `#4a6682` | `oklch(49.88% 0.0566 249.68)` | Luxe Blue | white, 6 to 1 |
| 10 | `#50658a` | `oklch(50.47% 0.0641 262.10)` | Luxe Blue | white, 5.8 to 1 |
| 11 | `#5b608e` | `oklch(50.45% 0.0736 279.07)` | Karmic Grape | white, 5.9 to 1 |
| 12 | `#6a588d` | `oklch(50.04% 0.0842 298.93)` | Butterfly Bush | white, 6.1 to 1 |
| 13 | `#7a4f83` | `oklch(49.45% 0.0954 320.03)` | Meadow Violet | white, 6.4 to 1 |
| 14 | `#874672` | `oklch(48.91% 0.1064 340.69)` | Grape Kiss | white, 6.6 to 1 |
| 15 | `#923f5e` | `oklch(48.64% 0.1164 359.27)` | Aurora Magenta | white, 6.7 to 1 |
| 16 | `#993c4a` | `oklch(48.85% 0.1248 14.09)` | Romp | white, 6.7 to 1 |
| 17 | `#a03e3d` | `oklch(49.76% 0.1311 23.71)` | Burning Bush | white, 6.4 to 1 |
| 18 | `#a74136` | `oklch(51.32% 0.1367 28.75)` | Cherry Race | white, 6 to 1 |
| 19 | `#b04637` | `oklch(53.33% 0.1417 30.54)` | Spiced Up | white, 5.5 to 1 |
| 20 | `#b94b3c` | `oklch(55.61% 0.1457 30.26)` | Conker | white, 5 to 1 |
| 21 | `#c35143` | `oklch(57.96% 0.1488 29.15)` | Sweet Baby Rose | white, 4.6 to 1 |
| 22 | `#cb574b` | `oklch(60.20% 0.1505 28.41)` | Chilli Cashew | black, 4.9 to 1 |
| 23 | `#d25d4e` | `oklch(62.12% 0.1508 29.25)` | Wet Coral | black, 5.4 to 1 |
| 24 | `#d6634c` | `oklch(63.53% 0.1494 32.88)` | Track and Field | black, 5.7 to 1 |
| 25 | `#d56a42` | `oklch(64.33% 0.1457 40.22)` | Fresh Acorn | black, 5.9 to 1 |
| 26 | `#d07235` | `oklch(64.70% 0.1389 50.60)` | Mann Orange | black, 6.1 to 1 |
| 27 | `#c57a2a` | `oklch(64.73% 0.1300 62.99)` | Maine Coon Orange | black, 6.2 to 1 |
| 28 | `#b78329` | `oklch(64.53% 0.1197 76.40)` | Nouveau Green | black, 6.2 to 1 |
| 29 | `#a78933` | `oklch(64.20% 0.1092 89.81)` | Rich Gold | black, 6.2 to 1 |
| 30 | `#978e41` | `oklch(63.83% 0.0994 102.21)` | Jalapeño | black, 6.2 to 1 |
| 31 | `#8b914d` | `oklch(63.53% 0.0911 112.60)` | Fair and Square | black, 6.2 to 1 |
| 32 | `#849256` | `oklch(63.39% 0.0854 119.97)` | Pretty Maiden | black, 6.2 to 1 |

## CSS

```css
background: linear-gradient(315deg, #223044 0.0%, #253549 3.2%, #293b4f 6.5%, #2e4357 9.7%, #344c5f 12.9%, #3a5568 16.1%, #405d71 19.4%, #45637a 22.6%, #4a6682 25.8%, #50658a 29.0%, #5b608e 32.3%, #6a588d 35.5%, #7a4f83 38.7%, #874672 41.9%, #923f5e 45.2%, #993c4a 48.4%, #a03e3d 51.6%, #a74136 54.8%, #b04637 58.1%, #b94b3c 61.3%, #c35143 64.5%, #cb574b 67.7%, #d25d4e 71.0%, #d6634c 74.2%, #d56a42 77.4%, #d07235 80.6%, #c57a2a 83.9%, #b78329 87.1%, #a78933 90.3%, #978e41 93.5%, #8b914d 96.8%, #849256 100.0%);
background: linear-gradient(315deg in oklch, oklch(30.71% 0.0413 255.94) 0.0%, oklch(32.36% 0.0420 254.24) 3.2%, oklch(34.72% 0.0425 250.88) 6.5%, oklch(37.54% 0.0429 246.83) 9.7%, oklch(40.56% 0.0438 243.03) 12.9%, oklch(43.56% 0.0453 240.45) 16.1%, oklch(46.27% 0.0477 240.05) 19.4%, oklch(48.46% 0.0514 242.79) 22.6%, oklch(49.88% 0.0566 249.68) 25.8%, oklch(50.47% 0.0641 262.10) 29.0%, oklch(50.45% 0.0736 279.07) 32.3%, oklch(50.04% 0.0842 298.93) 35.5%, oklch(49.45% 0.0954 320.03) 38.7%, oklch(48.91% 0.1064 340.69) 41.9%, oklch(48.64% 0.1164 359.27) 45.2%, oklch(48.85% 0.1248 14.09) 48.4%, oklch(49.76% 0.1311 23.71) 51.6%, oklch(51.32% 0.1367 28.75) 54.8%, oklch(53.33% 0.1417 30.54) 58.1%, oklch(55.61% 0.1457 30.26) 61.3%, oklch(57.96% 0.1488 29.15) 64.5%, oklch(60.20% 0.1505 28.41) 67.7%, oklch(62.12% 0.1508 29.25) 71.0%, oklch(63.53% 0.1494 32.88) 74.2%, oklch(64.33% 0.1457 40.22) 77.4%, oklch(64.70% 0.1389 50.60) 80.6%, oklch(64.73% 0.1300 62.99) 83.9%, oklch(64.53% 0.1197 76.40) 87.1%, oklch(64.20% 0.1092 89.81) 90.3%, oklch(63.83% 0.0994 102.21) 93.5%, oklch(63.53% 0.0911 112.60) 96.8%, oklch(63.39% 0.0854 119.97) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.307 | 0.041 | 255.9 |
| 2 | 0.496 | 0.055 | 247.5 |
| 3 | 0.492 | 0.128 | 379.6 |
| 4 | 0.638 | 0.149 | 394.4 |
| 5 | 0.634 | 0.085 | 480 |

## In these collections

- [Tomato vine abundance](https://grabient.com/tomato-vine-abundance)

## Other forms

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