# Indigo night to clay

Tritone navy, purple and salmon linear gradient with 32 colors: #0b0e2a, #0d102c, #0f112f, #121333, #151638, #19183d, #1d1b42, #211e47, #26204c, #2b2351, #302656, #36285b, #3c2a5f, #422d63, #492f67, #50316b, #57346f, #5f3672, #673975, #6f3b77, #773e78, #804179, #894479, #934878, #9c4c76, #a65174, #af5671, #b75b6e, #be616a, #c36667, #c86a65, #cb6e63. Edit it and copy or download CSS, SVG, PNG or shader code.

- Also called: Tritone navy, purple and salmon linear gradient
- Seed: `kULijDp59B7upxHRq8bA`
- Page: https://grabient.com/kULijDp59B7upxHRq8bA?steps=32&angle=135
- Drawn as: linear gradient, 32 steps, 135 degrees
- Kinds: dark to light
- Hues: wide
- Contrast of its darkest and lightest colors: 5.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 | `#0b0e2a` | `oklch(18.11% 0.0551 274.92)` | Void | white, 18.8 to 1 |
| 2 | `#0d102c` | `oklch(18.84% 0.0569 275.80)` | Spanish Roast | white, 18.6 to 1 |
| 3 | `#0f112f` | `oklch(19.77% 0.0591 276.81)` | Spanish Roast | white, 18.3 to 1 |
| 4 | `#121333` | `oklch(20.85% 0.0617 277.96)` | Spanish Roast | white, 17.9 to 1 |
| 5 | `#151638` | `oklch(22.07% 0.0647 279.27)` | Lost in Sadness | white, 17.4 to 1 |
| 6 | `#19183d` | `oklch(23.39% 0.0679 280.74)` | Nightwalker | white, 16.9 to 1 |
| 7 | `#1d1b42` | `oklch(24.80% 0.0713 282.38)` | Konkikyō Blue | white, 16.3 to 1 |
| 8 | `#211e47` | `oklch(26.25% 0.0747 284.22)` | Azulado | white, 15.6 to 1 |
| 9 | `#26204c` | `oklch(27.73% 0.0781 286.25)` | Silent Orbit | white, 15 to 1 |
| 10 | `#2b2351` | `oklch(29.20% 0.0814 288.49)` | Pāua | white, 14.3 to 1 |
| 11 | `#302656` | `oklch(30.64% 0.0845 290.96)` | Ceremonial Purple | white, 13.6 to 1 |
| 12 | `#36285b` | `oklch(32.04% 0.0874 293.65)` | Paris M | white, 13 to 1 |
| 13 | `#3c2a5f` | `oklch(33.47% 0.0904 296.55)` | Paris M | white, 12.4 to 1 |
| 14 | `#422d63` | `oklch(34.93% 0.0936 299.65)` | Violet Indigo | white, 11.7 to 1 |
| 15 | `#492f67` | `oklch(36.42% 0.0968 302.95)` | Violet Indigo | white, 11.1 to 1 |
| 16 | `#50316b` | `oklch(37.94% 0.0999 306.45)` | Petunia | white, 10.4 to 1 |
| 17 | `#57346f` | `oklch(39.48% 0.1030 310.15)` | Purple Protégé | white, 9.8 to 1 |
| 18 | `#5f3672` | `oklch(41.03% 0.1059 314.03)` | Lounge Violet | white, 9.2 to 1 |
| 19 | `#673975` | `oklch(42.61% 0.1086 318.11)` | Comtesse | white, 8.7 to 1 |
| 20 | `#6f3b77` | `oklch(44.19% 0.1110 322.37)` | Eminence | white, 8.1 to 1 |
| 21 | `#773e78` | `oklch(45.78% 0.1132 326.81)` | Spring Lobster Dye | white, 7.6 to 1 |
| 22 | `#804179` | `oklch(47.39% 0.1149 331.47)` | Sister Loganberry Frost | white, 7.1 to 1 |
| 23 | `#894479` | `oklch(49.13% 0.1163 336.81)` | Purpurite Red | white, 6.6 to 1 |
| 24 | `#934878` | `oklch(51.00% 0.1173 342.79)` | Sugar Plum | white, 6.1 to 1 |
| 25 | `#9c4c76` | `oklch(52.93% 0.1181 349.18)` | Orchid Lei | white, 5.6 to 1 |
| 26 | `#a65174` | `oklch(54.89% 0.1186 355.79)` | China Rose | white, 5.2 to 1 |
| 27 | `#af5671` | `oklch(56.81% 0.1190 2.40)` | Pink Parakeet | white, 4.7 to 1 |
| 28 | `#b75b6e` | `oklch(58.65% 0.1192 8.80)` | Candied Apple | black, 4.7 to 1 |
| 29 | `#be616a` | `oklch(60.36% 0.1194 14.77)` | Candy Drop | black, 5 to 1 |
| 30 | `#c36667` | `oklch(61.89% 0.1195 20.10)` | Stormy Passion | black, 5.4 to 1 |
| 31 | `#c86a65` | `oklch(63.17% 0.1197 24.58)` | Cuban Plaza | black, 5.7 to 1 |
| 32 | `#cb6e63` | `oklch(64.17% 0.1199 27.99)` | Dash of Curry | black, 5.9 to 1 |

## CSS

```css
background: linear-gradient(135deg, #0b0e2a 0.0%, #0d102c 3.2%, #0f112f 6.5%, #121333 9.7%, #151638 12.9%, #19183d 16.1%, #1d1b42 19.4%, #211e47 22.6%, #26204c 25.8%, #2b2351 29.0%, #302656 32.3%, #36285b 35.5%, #3c2a5f 38.7%, #422d63 41.9%, #492f67 45.2%, #50316b 48.4%, #57346f 51.6%, #5f3672 54.8%, #673975 58.1%, #6f3b77 61.3%, #773e78 64.5%, #804179 67.7%, #894479 71.0%, #934878 74.2%, #9c4c76 77.4%, #a65174 80.6%, #af5671 83.9%, #b75b6e 87.1%, #be616a 90.3%, #c36667 93.5%, #c86a65 96.8%, #cb6e63 100.0%);
background: linear-gradient(135deg in oklch, oklch(18.11% 0.0551 274.92) 0.0%, oklch(18.84% 0.0569 275.80) 3.2%, oklch(19.77% 0.0591 276.81) 6.5%, oklch(20.85% 0.0617 277.96) 9.7%, oklch(22.07% 0.0647 279.27) 12.9%, oklch(23.39% 0.0679 280.74) 16.1%, oklch(24.80% 0.0713 282.38) 19.4%, oklch(26.25% 0.0747 284.22) 22.6%, oklch(27.73% 0.0781 286.25) 25.8%, oklch(29.20% 0.0814 288.49) 29.0%, oklch(30.64% 0.0845 290.96) 32.3%, oklch(32.04% 0.0874 293.65) 35.5%, oklch(33.47% 0.0904 296.55) 38.7%, oklch(34.93% 0.0936 299.65) 41.9%, oklch(36.42% 0.0968 302.95) 45.2%, oklch(37.94% 0.0999 306.45) 48.4%, oklch(39.48% 0.1030 310.15) 51.6%, oklch(41.03% 0.1059 314.03) 54.8%, oklch(42.61% 0.1086 318.11) 58.1%, oklch(44.19% 0.1110 322.37) 61.3%, oklch(45.78% 0.1132 326.81) 64.5%, oklch(47.39% 0.1149 331.47) 67.7%, oklch(49.13% 0.1163 336.81) 71.0%, oklch(51.00% 0.1173 342.79) 74.2%, oklch(52.93% 0.1181 349.18) 77.4%, oklch(54.89% 0.1186 355.79) 80.6%, oklch(56.81% 0.1190 2.40) 83.9%, oklch(58.65% 0.1192 8.80) 87.1%, oklch(60.36% 0.1194 14.77) 90.3%, oklch(61.89% 0.1195 20.10) 93.5%, oklch(63.17% 0.1197 24.58) 96.8%, oklch(64.17% 0.1199 27.99) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.181 | 0.055 | 274.9 |
| 2 | 0.311 | 0.085 | 291.8 |
| 3 | 0.469 | 0.114 | 329.9 |
| 4 | 0.642 | 0.12 | 388 |

## In these collections

- [Desert colors](https://grabient.com/desert-colors)

## Other forms

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