# Navy teal dusk glow

Monochrome gray to navy linear gradient with 32 colors: #646662, #5c625c, #515b54, #42534c, #314a47, #1f4143, #0e3641, #052c3f, #06233e, #0c1d3d, #111a3d, #161b40, #1d2247, #252e51, #2f3d5e, #3c4e6b, #4a5f79, #597186, #688091, #758c9a, #7d94a0, #8197a2, #7e94a0, #788d9a, #6e8392, #637788, #576a7d, #4b5c72, #404f67, #37435d, #303a55, #2c3450. Edit it and copy or download CSS, SVG, PNG or shader code.

- Also called: Monochrome gray to navy linear gradient
- Seed: `kUgQZeHZlQdQLOuqEsTg`
- Page: https://grabient.com/kUgQZeHZlQdQLOuqEsTg?steps=32&angle=135
- Drawn as: linear gradient, 32 steps, 135 degrees
- Kinds: muted, cool
- Hues: analogous
- Contrast of its darkest and lightest colors: 5.5 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 | `#646662` | `oklch(50.79% 0.0083 132.19)` | Black Locust | white, 5.7 to 1 |
| 2 | `#5c625c` | `oklch(48.91% 0.0122 140.95)` | Charcoal Briquette | white, 6.2 to 1 |
| 3 | `#515b54` | `oklch(46.12% 0.0177 153.15)` | Alpine Trail | white, 7 to 1 |
| 4 | `#42534c` | `oklch(42.69% 0.0244 167.92)` | Moss Cottage | white, 8.1 to 1 |
| 5 | `#314a47` | `oklch(38.89% 0.0319 184.39)` | Frontier | white, 9.4 to 1 |
| 6 | `#1f4143` | `oklch(34.97% 0.0397 201.68)` | Pine Hollow | white, 11.1 to 1 |
| 7 | `#0e3641` | `oklch(31.21% 0.0474 218.91)` | Firmament Blue | white, 12.8 to 1 |
| 8 | `#052c3f` | `oklch(27.87% 0.0545 235.22)` | Murky Depths | white, 14.5 to 1 |
| 9 | `#06233e` | `oklch(25.23% 0.0607 249.73)` | Rhapsody in Blue | white, 15.8 to 1 |
| 10 | `#0c1d3d` | `oklch(23.54% 0.0655 261.56)` | Midnight Mirage | white, 16.7 to 1 |
| 11 | `#111a3d` | `oklch(23.07% 0.0684 269.85)` | Nightwalker | white, 17 to 1 |
| 12 | `#161b40` | `oklch(24.16% 0.0691 273.92)` | Nightwalker | white, 16.5 to 1 |
| 13 | `#1d2247` | `oklch(26.98% 0.0677 274.25)` | Black Market | white, 15.2 to 1 |
| 14 | `#252e51` | `oklch(31.17% 0.0645 271.59)` | Wahoo | white, 13.2 to 1 |
| 15 | `#2f3d5e` | `oklch(36.34% 0.0601 266.67)` | Gulf Blue | white, 10.7 to 1 |
| 16 | `#3c4e6b` | `oklch(42.07% 0.0549 260.20)` | Ensign Blue | white, 8.4 to 1 |
| 17 | `#4a5f79` | `oklch(47.98% 0.0493 252.92)` | Stream | white, 6.5 to 1 |
| 18 | `#597186` | `oklch(53.66% 0.0437 245.55)` | Silver Blueberry | white, 5.1 to 1 |
| 19 | `#688091` | `oklch(58.72% 0.0385 238.80)` | Blue Prince | black, 5 to 1 |
| 20 | `#758c9a` | `oklch(62.76% 0.0343 233.41)` | Bluish Grey | black, 5.9 to 1 |
| 21 | `#7d94a0` | `oklch(65.38% 0.0313 230.10)` | Wethers Field | black, 6.6 to 1 |
| 22 | `#8197a2` | `oklch(66.21% 0.0301 229.52)` | Poolhouse | black, 6.8 to 1 |
| 23 | `#7e94a0` | `oklch(65.35% 0.0302 231.03)` | Wethers Field | black, 6.6 to 1 |
| 24 | `#788d9a` | `oklch(63.16% 0.0314 234.07)` | Sheltered Bay | black, 6 to 1 |
| 25 | `#6e8392` | `oklch(59.93% 0.0333 238.28)` | Mica Creek | black, 5.3 to 1 |
| 26 | `#637788` | `oklch(55.96% 0.0358 243.32)` | Space Convoy | white, 4.6 to 1 |
| 27 | `#576a7d` | `oklch(51.53% 0.0387 248.84)` | Fern Flower | white, 5.5 to 1 |
| 28 | `#4b5c72` | `oklch(46.96% 0.0418 254.51)` | Bluster Blue | white, 6.8 to 1 |
| 29 | `#404f67` | `oklch(42.53% 0.0447 259.97)` | Calico Dress | white, 8.2 to 1 |
| 30 | `#37435d` | `oklch(38.54% 0.0474 264.88)` | Diplomatic | white, 9.8 to 1 |
| 31 | `#303a55` | `oklch(35.29% 0.0495 268.90)` | Madison | white, 11.2 to 1 |
| 32 | `#2c3450` | `oklch(33.07% 0.0510 271.68)` | Blue Lobelia | white, 12.2 to 1 |

## CSS

```css
background: linear-gradient(135deg, #646662 0.0%, #5c625c 3.2%, #515b54 6.5%, #42534c 9.7%, #314a47 12.9%, #1f4143 16.1%, #0e3641 19.4%, #052c3f 22.6%, #06233e 25.8%, #0c1d3d 29.0%, #111a3d 32.3%, #161b40 35.5%, #1d2247 38.7%, #252e51 41.9%, #2f3d5e 45.2%, #3c4e6b 48.4%, #4a5f79 51.6%, #597186 54.8%, #688091 58.1%, #758c9a 61.3%, #7d94a0 64.5%, #8197a2 67.7%, #7e94a0 71.0%, #788d9a 74.2%, #6e8392 77.4%, #637788 80.6%, #576a7d 83.9%, #4b5c72 87.1%, #404f67 90.3%, #37435d 93.5%, #303a55 96.8%, #2c3450 100.0%);
background: linear-gradient(135deg in oklch, oklch(50.79% 0.0083 132.19) 0.0%, oklch(48.91% 0.0122 140.95) 3.2%, oklch(46.12% 0.0177 153.15) 6.5%, oklch(42.69% 0.0244 167.92) 9.7%, oklch(38.89% 0.0319 184.39) 12.9%, oklch(34.97% 0.0397 201.68) 16.1%, oklch(31.21% 0.0474 218.91) 19.4%, oklch(27.87% 0.0545 235.22) 22.6%, oklch(25.23% 0.0607 249.73) 25.8%, oklch(23.54% 0.0655 261.56) 29.0%, oklch(23.07% 0.0684 269.85) 32.3%, oklch(24.16% 0.0691 273.92) 35.5%, oklch(26.98% 0.0677 274.25) 38.7%, oklch(31.17% 0.0645 271.59) 41.9%, oklch(36.34% 0.0601 266.67) 45.2%, oklch(42.07% 0.0549 260.20) 48.4%, oklch(47.98% 0.0493 252.92) 51.6%, oklch(53.66% 0.0437 245.55) 54.8%, oklch(58.72% 0.0385 238.80) 58.1%, oklch(62.76% 0.0343 233.41) 61.3%, oklch(65.38% 0.0313 230.10) 64.5%, oklch(66.21% 0.0301 229.52) 67.7%, oklch(65.35% 0.0302 231.03) 71.0%, oklch(63.16% 0.0314 234.07) 74.2%, oklch(59.93% 0.0333 238.28) 77.4%, oklch(55.96% 0.0358 243.32) 80.6%, oklch(51.53% 0.0387 248.84) 83.9%, oklch(46.96% 0.0418 254.51) 87.1%, oklch(42.53% 0.0447 259.97) 90.3%, oklch(38.54% 0.0474 264.88) 93.5%, oklch(35.29% 0.0495 268.90) 96.8%, oklch(33.07% 0.0510 271.68) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.508 | 0.008 | 132.2 |
| 2 | 0.232 | 0.069 | 271.7 |
| 3 | 0.661 | 0.03 | 229.4 |
| 4 | 0.331 | 0.051 | 271.7 |

## In these collections

- [Dusk gradients](https://grabient.com/dusk-gradients)

## Other forms

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