# Navy, gray and brown linear gradient

Navy, gray and brown linear gradient with 32 colors: #17274b, #1b2c51, #1f335b, #243c66, #2b4670, #344f7a, #3e5980, #4a6585, #597088, #69798c, #778190, #858795, #928d98, #9d9198, #a59696, #a99992, #aa9a8d, #ac9885, #af937b, #b18c70, #b18467, #ac7b5e, #a47254, #99684a, #8c5e41, #80533a, #744935, #683f33, #5a3632, #4c2e30, #3f272d, #37232a. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kaRzO8txw_M2IwHYiNH0Jq_joYv0kC7og`
- Page: https://grabient.com/kaRzO8txw_M2IwHYiNH0Jq_joYv0kC7og?steps=32&angle=135
- Drawn as: linear gradient, 32 steps, 135 degrees
- Kinds: light center, muted
- Hues: split-complementary
- Contrast of its darkest and lightest colors: 5.4 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 | `#17274b` | `oklch(27.95% 0.0703 265.08)` | Rurikon Blue | white, 14.7 to 1 |
| 2 | `#1b2c51` | `oklch(29.92% 0.0721 264.09)` | Pico Void | white, 13.7 to 1 |
| 3 | `#1f335b` | `oklch(32.67% 0.0752 262.60)` | Boatswain | white, 12.4 to 1 |
| 4 | `#243c66` | `oklch(35.92% 0.0782 260.97)` | Blue Depths | white, 10.9 to 1 |
| 5 | `#2b4670` | `oklch(39.38% 0.0796 259.58)` | Blue Funk | white, 9.5 to 1 |
| 6 | `#344f7a` | `oklch(42.77% 0.0779 258.79)` | High Altar | white, 8.2 to 1 |
| 7 | `#3e5980` | `oklch(46.13% 0.0714 257.21)` | Sailor | white, 7 to 1 |
| 8 | `#4a6585` | `oklch(49.79% 0.0604 253.45)` | French Mirage Blue | white, 6 to 1 |
| 9 | `#597088` | `oklch(53.51% 0.0474 250.42)` | Captains Blue | white, 5.1 to 1 |
| 10 | `#69798c` | `oklch(57.04% 0.0350 251.10)` | Menacing Clouds | black, 4.7 to 1 |
| 11 | `#778190` | `oklch(60.13% 0.0255 258.49)` | Link | black, 5.3 to 1 |
| 12 | `#858795` | `oklch(62.69% 0.0204 276.49)` | Roman Silver | black, 5.9 to 1 |
| 13 | `#928d98` | `oklch(65.02% 0.0177 306.58)` | Minimal Grey | black, 6.4 to 1 |
| 14 | `#9d9198` | `oklch(67.01% 0.0170 342.58)` | Lavender Elan | black, 6.9 to 1 |
| 15 | `#a59696` | `oklch(68.54% 0.0182 17.89)` | Roman Snail | black, 7.3 to 1 |
| 16 | `#a99992` | `oklch(69.48% 0.0212 45.92)` | Putty Pearl | black, 7.6 to 1 |
| 17 | `#aa9a8d` | `oklch(69.71% 0.0265 60.97)` | Cobblestone | black, 7.7 to 1 |
| 18 | `#ac9885` | `oklch(69.29% 0.0358 65.64)` | Quicksand | black, 7.6 to 1 |
| 19 | `#af937b` | `oklch(68.29% 0.0476 63.74)` | Sandrift | black, 7.3 to 1 |
| 20 | `#b18c70` | `oklch(66.79% 0.0594 58.62)` | Jama Masjid Taupe | black, 6.8 to 1 |
| 21 | `#b18467` | `oklch(64.87% 0.0690 53.61)` | Cider Spice | black, 6.3 to 1 |
| 22 | `#ac7b5e` | `oklch(62.56% 0.0743 51.77)` | Tobey Rattan | black, 5.7 to 1 |
| 23 | `#a47254` | `oklch(59.62% 0.0763 51.82)` | Dodge Pole | black, 5.1 to 1 |
| 24 | `#99684a` | `oklch(56.14% 0.0760 52.15)` | Old Driftwood | white, 4.7 to 1 |
| 25 | `#8c5e41` | `oklch(52.39% 0.0740 51.84)` | Western Pursuit | white, 5.5 to 1 |
| 26 | `#80533a` | `oklch(48.63% 0.0707 50.02)` | Dachshund | white, 6.5 to 1 |
| 27 | `#744935` | `oklch(45.10% 0.0668 45.74)` | Riding Boots | white, 7.6 to 1 |
| 28 | `#683f33` | `oklch(41.39% 0.0608 37.68)` | Sekkasshoku Brown | white, 8.9 to 1 |
| 29 | `#5a3632` | `oklch(37.49% 0.0528 26.88)` | Arresting Auburn | white, 10.4 to 1 |
| 30 | `#4c2e30` | `oklch(33.77% 0.0443 15.34)` | Cab Sav | white, 12.1 to 1 |
| 31 | `#3f272d` | `oklch(30.60% 0.0368 5.08)` | Toledo | white, 13.5 to 1 |
| 32 | `#37232a` | `oklch(28.35% 0.0317 358.07)` | Aubergine | white, 14.6 to 1 |

## CSS

```css
background: linear-gradient(135deg, #17274b 0.0%, #1b2c51 3.2%, #1f335b 6.5%, #243c66 9.7%, #2b4670 12.9%, #344f7a 16.1%, #3e5980 19.4%, #4a6585 22.6%, #597088 25.8%, #69798c 29.0%, #778190 32.3%, #858795 35.5%, #928d98 38.7%, #9d9198 41.9%, #a59696 45.2%, #a99992 48.4%, #aa9a8d 51.6%, #ac9885 54.8%, #af937b 58.1%, #b18c70 61.3%, #b18467 64.5%, #ac7b5e 67.7%, #a47254 71.0%, #99684a 74.2%, #8c5e41 77.4%, #80533a 80.6%, #744935 83.9%, #683f33 87.1%, #5a3632 90.3%, #4c2e30 93.5%, #3f272d 96.8%, #37232a 100.0%);
background: linear-gradient(135deg in oklch, oklch(27.95% 0.0703 265.08) 0.0%, oklch(29.92% 0.0721 264.09) 3.2%, oklch(32.67% 0.0752 262.60) 6.5%, oklch(35.92% 0.0782 260.97) 9.7%, oklch(39.38% 0.0796 259.58) 12.9%, oklch(42.77% 0.0779 258.79) 16.1%, oklch(46.13% 0.0714 257.21) 19.4%, oklch(49.79% 0.0604 253.45) 22.6%, oklch(53.51% 0.0474 250.42) 25.8%, oklch(57.04% 0.0350 251.10) 29.0%, oklch(60.13% 0.0255 258.49) 32.3%, oklch(62.69% 0.0204 276.49) 35.5%, oklch(65.02% 0.0177 306.58) 38.7%, oklch(67.01% 0.0170 342.58) 41.9%, oklch(68.54% 0.0182 17.89) 45.2%, oklch(69.48% 0.0212 45.92) 48.4%, oklch(69.71% 0.0265 60.97) 51.6%, oklch(69.29% 0.0358 65.64) 54.8%, oklch(68.29% 0.0476 63.74) 58.1%, oklch(66.79% 0.0594 58.62) 61.3%, oklch(64.87% 0.0690 53.61) 64.5%, oklch(62.56% 0.0743 51.77) 67.7%, oklch(59.62% 0.0763 51.82) 71.0%, oklch(56.14% 0.0760 52.15) 74.2%, oklch(52.39% 0.0740 51.84) 77.4%, oklch(48.63% 0.0707 50.02) 80.6%, oklch(45.10% 0.0668 45.74) 83.9%, oklch(41.39% 0.0608 37.68) 87.1%, oklch(37.49% 0.0528 26.88) 90.3%, oklch(33.77% 0.0443 15.34) 93.5%, oklch(30.60% 0.0368 5.08) 96.8%, oklch(28.35% 0.0317 358.07) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.28 | 0.07 | 265.1 |
| 2 | 0.433 | 0.077 | 258.7 |
| 3 | 0.61 | 0.023 | 263 |
| 4 | 0.697 | 0.023 | 415.1 |
| 5 | 0.634 | 0.073 | 412 |
| 6 | 0.457 | 0.068 | 406.7 |
| 7 | 0.283 | 0.032 | 358.1 |

## In these collections

- [Champagne silk reception](https://grabient.com/champagne-silk-reception)

## Other forms

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