# Smoke blue indigo diagonal

Blue, green, navy and maroon linear gradient with 48 colors: #294560, #294b64, #2a5369, #2c5d6d, #316771, #3a7374, #477e76, #558878, #65927a, #739a7d, #80a280, #89a883, #8dac87, #8db08c, #89b494, #82b79d, #7bb9a7, #74b9b3, #70b7be, #70b3c7, #74aecd, #7ba8d0, #81a1cf, #849acb, #8594c6, #828cbe, #7b84b4, #737ba9, #69719d, #5e6891, #535e85, #49557a, #404d70, #394667, #343f60, #323a5c, #32365a, #36335a, #3c305a, #432e5a, #4d2c59, #572a56, #622952, #6c274b, #742642, #7c2639, #812730, #842727. Edit it and copy or download CSS, SVG, PNG or shader code.

- Also called: Blue, green, navy and maroon linear gradient
- Seed: `kWYSqw2hczNacTytFkBtS5NA`
- Page: https://grabient.com/kWYSqw2hczNacTytFkBtS5NA?steps=48&angle=135
- Drawn as: linear gradient, 48 steps, 135 degrees
- Kinds: light center, cool
- Hues: two-hue
- Contrast of its darkest and lightest colors: 5.2 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 | `#294560` | `oklch(38.19% 0.0579 248.20)` | Dark Slate Blue | white, 9.8 to 1 |
| 2 | `#294b64` | `oklch(39.92% 0.0581 242.08)` | Majolica Blue | white, 9.1 to 1 |
| 3 | `#2a5369` | `oklch(42.26% 0.0584 233.33)` | Shimmering Sea | white, 8.2 to 1 |
| 4 | `#2c5d6d` | `oklch(45.08% 0.0587 222.57)` | Night Shift | white, 7.2 to 1 |
| 5 | `#316771` | `oklch(48.25% 0.0590 210.44)` | Mordant Blue | white, 6.3 to 1 |
| 6 | `#3a7374` | `oklch(51.64% 0.0594 197.59)` | Ming | white, 5.4 to 1 |
| 7 | `#477e76` | `oklch(55.14% 0.0598 184.65)` | Azurite Water Green | white, 4.6 to 1 |
| 8 | `#558878` | `oklch(58.61% 0.0603 172.25)` | Privet Hedge | black, 5.1 to 1 |
| 9 | `#65927a` | `oklch(61.93% 0.0608 161.04)` | Cool Bluegrass | black, 5.9 to 1 |
| 10 | `#739a7d` | `oklch(64.97% 0.0614 151.65)` | Jade Green | black, 6.6 to 1 |
| 11 | `#80a280` | `oklch(67.60% 0.0621 144.72)` | Grey Green | black, 7.3 to 1 |
| 12 | `#89a883` | `oklch(69.71% 0.0628 140.88)` | Baby Spinach | black, 7.9 to 1 |
| 13 | `#8dac87` | `oklch(71.18% 0.0636 140.77)` | Flora Green | black, 8.4 to 1 |
| 14 | `#8db08c` | `oklch(72.23% 0.0647 144.71)` | Shaded Willow | black, 8.7 to 1 |
| 15 | `#89b494` | `oklch(73.00% 0.0660 152.14)` | King Theo | black, 9 to 1 |
| 16 | `#82b79d` | `oklch(73.50% 0.0674 162.39)` | Water Green | black, 9.2 to 1 |
| 17 | `#7bb9a7` | `oklch(73.73% 0.0690 174.81)` | Sereni Teal | black, 9.3 to 1 |
| 18 | `#74b9b3` | `oklch(73.71% 0.0707 188.72)` | Earth Eclipse | black, 9.2 to 1 |
| 19 | `#70b7be` | `oklch(73.45% 0.0722 203.45)` | Tibetan Stone | black, 9.1 to 1 |
| 20 | `#70b3c7` | `oklch(72.95% 0.0737 218.34)` | Delicate Girl Blue | black, 8.9 to 1 |
| 21 | `#74aecd` | `oklch(72.23% 0.0750 232.72)` | Aspara | black, 8.6 to 1 |
| 22 | `#7ba8d0` | `oklch(71.30% 0.0761 245.91)` | Calm Day | black, 8.3 to 1 |
| 23 | `#81a1cf` | `oklch(70.17% 0.0768 257.25)` | Boudoir Blue | black, 7.9 to 1 |
| 24 | `#849acb` | `oklch(68.84% 0.0772 266.08)` | Caribbean Sky | black, 7.4 to 1 |
| 25 | `#8594c6` | `oklch(67.27% 0.0770 271.86)` | Blue Hyacinth | black, 7 to 1 |
| 26 | `#828cbe` | `oklch(65.11% 0.0759 275.18)` | Pleated Mauve | black, 6.4 to 1 |
| 27 | `#7b84b4` | `oklch(62.44% 0.0742 276.56)` | Corsican Purple | black, 5.7 to 1 |
| 28 | `#737ba9` | `oklch(59.36% 0.0719 276.43)` | Minuet Lilac | black, 5.1 to 1 |
| 29 | `#69719d` | `oklch(56.01% 0.0693 275.22)` | Hyacinth Mauve | white, 4.7 to 1 |
| 30 | `#5e6891` | `oklch(52.52% 0.0666 273.35)` | Emerald-Crested Manakin | white, 5.4 to 1 |
| 31 | `#535e85` | `oklch(49.02% 0.0640 271.27)` | Karmic Grape | white, 6.3 to 1 |
| 32 | `#49557a` | `oklch(45.63% 0.0618 269.38)` | Deep Indigo | white, 7.2 to 1 |
| 33 | `#404d70` | `oklch(42.48% 0.0601 268.12)` | Ensign Blue | white, 8.3 to 1 |
| 34 | `#394667` | `oklch(39.69% 0.0591 267.92)` | Garnet Stone Blue | white, 9.3 to 1 |
| 35 | `#343f60` | `oklch(37.41% 0.0590 269.21)` | Gulf Blue | white, 10.3 to 1 |
| 36 | `#323a5c` | `oklch(35.74% 0.0601 272.42)` | Mediaeval Blue | white, 11 to 1 |
| 37 | `#32365a` | `oklch(34.76% 0.0627 277.87)` | Very Blue | white, 11.5 to 1 |
| 38 | `#36335a` | `oklch(34.33% 0.0666 285.38)` | Very Blue | white, 11.8 to 1 |
| 39 | `#3c305a` | `oklch(34.36% 0.0718 294.53)` | Jakarta Skyline | white, 11.8 to 1 |
| 40 | `#432e5a` | `oklch(34.78% 0.0779 304.93)` | Scarlet Gum | white, 11.7 to 1 |
| 41 | `#4d2c59` | `oklch(35.49% 0.0847 316.17)` | Scarlet Gum | white, 11.5 to 1 |
| 42 | `#572a56` | `oklch(36.41% 0.0918 327.84)` | Kuwanomi Purple | white, 11.1 to 1 |
| 43 | `#622952` | `oklch(37.47% 0.0990 339.55)` | Velvet Mauve | white, 10.7 to 1 |
| 44 | `#6c274b` | `oklch(38.56% 0.1060 350.89)` | Witch Soup | white, 10.3 to 1 |
| 45 | `#742642` | `oklch(39.62% 0.1126 1.46)` | Palace Red | white, 9.9 to 1 |
| 46 | `#7c2639` | `oklch(40.56% 0.1184 10.86)` | Suō | white, 9.5 to 1 |
| 47 | `#812730` | `oklch(41.29% 0.1232 18.68)` | Shiraz | white, 9.3 to 1 |
| 48 | `#842727` | `oklch(41.73% 0.1268 24.52)` | Flame Red | white, 9.1 to 1 |

## CSS

```css
background: linear-gradient(135deg, #294560 0.0%, #294b64 2.1%, #2a5369 4.3%, #2c5d6d 6.4%, #316771 8.5%, #3a7374 10.6%, #477e76 12.8%, #558878 14.9%, #65927a 17.0%, #739a7d 19.1%, #80a280 21.3%, #89a883 23.4%, #8dac87 25.5%, #8db08c 27.7%, #89b494 29.8%, #82b79d 31.9%, #7bb9a7 34.0%, #74b9b3 36.2%, #70b7be 38.3%, #70b3c7 40.4%, #74aecd 42.6%, #7ba8d0 44.7%, #81a1cf 46.8%, #849acb 48.9%, #8594c6 51.1%, #828cbe 53.2%, #7b84b4 55.3%, #737ba9 57.4%, #69719d 59.6%, #5e6891 61.7%, #535e85 63.8%, #49557a 66.0%, #404d70 68.1%, #394667 70.2%, #343f60 72.3%, #323a5c 74.5%, #32365a 76.6%, #36335a 78.7%, #3c305a 80.9%, #432e5a 83.0%, #4d2c59 85.1%, #572a56 87.2%, #622952 89.4%, #6c274b 91.5%, #742642 93.6%, #7c2639 95.7%, #812730 97.9%, #842727 100.0%);
background: linear-gradient(135deg in oklch, oklch(38.19% 0.0579 248.20) 0.0%, oklch(39.92% 0.0581 242.08) 2.1%, oklch(42.26% 0.0584 233.33) 4.3%, oklch(45.08% 0.0587 222.57) 6.4%, oklch(48.25% 0.0590 210.44) 8.5%, oklch(51.64% 0.0594 197.59) 10.6%, oklch(55.14% 0.0598 184.65) 12.8%, oklch(58.61% 0.0603 172.25) 14.9%, oklch(61.93% 0.0608 161.04) 17.0%, oklch(64.97% 0.0614 151.65) 19.1%, oklch(67.60% 0.0621 144.72) 21.3%, oklch(69.71% 0.0628 140.88) 23.4%, oklch(71.18% 0.0636 140.77) 25.5%, oklch(72.23% 0.0647 144.71) 27.7%, oklch(73.00% 0.0660 152.14) 29.8%, oklch(73.50% 0.0674 162.39) 31.9%, oklch(73.73% 0.0690 174.81) 34.0%, oklch(73.71% 0.0707 188.72) 36.2%, oklch(73.45% 0.0722 203.45) 38.3%, oklch(72.95% 0.0737 218.34) 40.4%, oklch(72.23% 0.0750 232.72) 42.6%, oklch(71.30% 0.0761 245.91) 44.7%, oklch(70.17% 0.0768 257.25) 46.8%, oklch(68.84% 0.0772 266.08) 48.9%, oklch(67.27% 0.0770 271.86) 51.1%, oklch(65.11% 0.0759 275.18) 53.2%, oklch(62.44% 0.0742 276.56) 55.3%, oklch(59.36% 0.0719 276.43) 57.4%, oklch(56.01% 0.0693 275.22) 59.6%, oklch(52.52% 0.0666 273.35) 61.7%, oklch(49.02% 0.0640 271.27) 63.8%, oklch(45.63% 0.0618 269.38) 66.0%, oklch(42.48% 0.0601 268.12) 68.1%, oklch(39.69% 0.0591 267.92) 70.2%, oklch(37.41% 0.0590 269.21) 72.3%, oklch(35.74% 0.0601 272.42) 74.5%, oklch(34.76% 0.0627 277.87) 76.6%, oklch(34.33% 0.0666 285.38) 78.7%, oklch(34.36% 0.0718 294.53) 80.9%, oklch(34.78% 0.0779 304.93) 83.0%, oklch(35.49% 0.0847 316.17) 85.1%, oklch(36.41% 0.0918 327.84) 87.2%, oklch(37.47% 0.0990 339.55) 89.4%, oklch(38.56% 0.1060 350.89) 91.5%, oklch(39.62% 0.1126 1.46) 93.6%, oklch(40.56% 0.1184 10.86) 95.7%, oklch(41.29% 0.1232 18.68) 97.9%, oklch(41.73% 0.1268 24.52) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.382 | 0.058 | 248.2 |
| 2 | 0.709 | 0.063 | 140.4 |
| 3 | 0.681 | 0.077 | 269.3 |
| 4 | 0.354 | 0.061 | 273.6 |
| 5 | 0.417 | 0.127 | 384.5 |

## In these collections

- [First woodsmoke evening](https://grabient.com/first-woodsmoke-evening)

## Other forms

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