# Blue, purple, brown and gray linear gradient

Blue, purple, brown and gray linear gradient with 48 colors: #487b9a, #497698, #4a6f94, #4b668e, #4c5c87, #4d527e, #4e4973, #4e4069, #4f385e, #503254, #512e4c, #542d45, #5a2f41, #623440, #6c3c42, #794845, #87564a, #956652, #a3775a, #b08965, #bc9b70, #c5ac7c, #ccba88, #d0c793, #d0cf9c, #d0d6a4, #cedcab, #cce0b2, #cae2b8, #c7e3bc, #c3e3c0, #bfe2c2, #badfc3, #b5dcc4, #afd7c3, #a9d1c1, #a1cabd, #98c0b7, #8db4af, #82a7a5, #76999a, #6a8a8e, #5f7c81, #546e75, #4b626a, #43575f, #3c4e57, #374851. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kWjjWorhjNeoZTTokcfMYnHQ`
- Page: https://grabient.com/kWjjWorhjNeoZTTokcfMYnHQ?steps=48&angle=135
- Drawn as: linear gradient, 48 steps, 135 degrees
- Kinds: light center, muted
- Hues: two-hue
- Contrast of its darkest and lightest colors: 8.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 | `#487b9a` | `oklch(55.91% 0.0730 236.95)` | Linoleum Blue | white, 4.6 to 1 |
| 2 | `#497698` | `oklch(54.71% 0.0727 242.61)` | Hammerhead Shark | white, 4.8 to 1 |
| 3 | `#4a6f94` | `oklch(52.90% 0.0723 249.72)` | Riverside | white, 5.2 to 1 |
| 4 | `#4b668e` | `oklch(50.65% 0.0718 258.06)` | Sea of Galilee | white, 5.8 to 1 |
| 5 | `#4c5c87` | `oklch(48.10% 0.0713 267.44)` | Wizard | white, 6.5 to 1 |
| 6 | `#4d527e` | `oklch(45.43% 0.0707 277.61)` | Roman Violet | white, 7.4 to 1 |
| 7 | `#4e4973` | `oklch(42.79% 0.0701 288.39)` | Purple Berry | white, 8.3 to 1 |
| 8 | `#4e4069` | `oklch(40.34% 0.0695 299.54)` | Geode | white, 9.3 to 1 |
| 9 | `#4f385e` | `oklch(38.23% 0.0690 310.86)` | Dark Blackberry | white, 10.2 to 1 |
| 10 | `#503254` | `oklch(36.65% 0.0685 322.12)` | Blackberry Cordial | white, 10.9 to 1 |
| 11 | `#512e4c` | `oklch(35.73% 0.0680 333.12)` | Plum Skin | white, 11.3 to 1 |
| 12 | `#542d45` | `oklch(35.64% 0.0677 343.64)` | Potent Purple | white, 11.4 to 1 |
| 13 | `#5a2f41` | `oklch(36.55% 0.0675 353.50)` | Fig | white, 11 to 1 |
| 14 | `#623440` | `oklch(38.65% 0.0675 3.32)` | Art Deco Red | white, 10.1 to 1 |
| 15 | `#6c3c42` | `oklch(41.80% 0.0677 13.34)` | Wild Cranberry | white, 8.8 to 1 |
| 16 | `#794845` | `oklch(45.78% 0.0680 23.48)` | Cocobolo | white, 7.4 to 1 |
| 17 | `#87564a` | `oklch(50.40% 0.0684 33.65)` | Potter’s Rock | white, 6 to 1 |
| 18 | `#956652` | `oklch(55.43% 0.0689 43.79)` | Stormy Plum | white, 4.8 to 1 |
| 19 | `#a3775a` | `oklch(60.66% 0.0693 53.80)` | Walking Stick | black, 5.3 to 1 |
| 20 | `#b08965` | `oklch(65.87% 0.0697 63.61)` | Syrup | black, 6.6 to 1 |
| 21 | `#bc9b70` | `oklch(70.86% 0.0699 73.13)` | Ancient Fresco | black, 8 to 1 |
| 22 | `#c5ac7c` | `oklch(75.41% 0.0699 82.30)` | Toupe | black, 9.5 to 1 |
| 23 | `#ccba88` | `oklch(79.31% 0.0697 91.02)` | Appalachian Trail | black, 10.9 to 1 |
| 24 | `#d0c793` | `oklch(82.34% 0.0693 99.22)` | Dusty Yellow | black, 12.2 to 1 |
| 25 | `#d0cf9c` | `oklch(84.40% 0.0684 106.82)` | Corn Husk Green | black, 13.1 to 1 |
| 26 | `#d0d6a4` | `oklch(85.97% 0.0673 113.83)` | White Jade | black, 13.8 to 1 |
| 27 | `#cedcab` | `oklch(87.16% 0.0660 120.33)` | Chameleon | black, 14.4 to 1 |
| 28 | `#cce0b2` | `oklch(87.98% 0.0644 126.40)` | Rockmelon Rind | black, 14.8 to 1 |
| 29 | `#cae2b8` | `oklch(88.45% 0.0627 132.10)` | Iced Avocado | black, 15.1 to 1 |
| 30 | `#c7e3bc` | `oklch(88.57% 0.0608 137.52)` | Iced Avocado | black, 15.1 to 1 |
| 31 | `#c3e3c0` | `oklch(88.37% 0.0588 142.72)` | Ambrosia | black, 15 to 1 |
| 32 | `#bfe2c2` | `oklch(87.84% 0.0567 147.80)` | Sugar Mint | black, 14.8 to 1 |
| 33 | `#badfc3` | `oklch(87.00% 0.0547 152.82)` | Lattice Work | black, 14.4 to 1 |
| 34 | `#b5dcc4` | `oklch(85.86% 0.0526 157.86)` | Quantum Effect | black, 13.9 to 1 |
| 35 | `#afd7c3` | `oklch(84.44% 0.0506 163.00)` | Chlorophyll Cream | black, 13.3 to 1 |
| 36 | `#a9d1c1` | `oklch(82.75% 0.0487 168.31)` | Swimming Pool Green | black, 12.5 to 1 |
| 37 | `#a1cabd` | `oklch(80.61% 0.0468 173.89)` | Tareyton | black, 11.7 to 1 |
| 38 | `#98c0b7` | `oklch(77.70% 0.0448 179.78)` | Shadow Green | black, 10.5 to 1 |
| 39 | `#8db4af` | `oklch(74.13% 0.0427 185.86)` | Artful Aqua | black, 9.3 to 1 |
| 40 | `#82a7a5` | `oklch(70.08% 0.0405 192.05)` | Acapulco Aqua | black, 8 to 1 |
| 41 | `#76999a` | `oklch(65.69% 0.0383 198.22)` | Undertow | black, 6.7 to 1 |
| 42 | `#6a8a8e` | `oklch(61.13% 0.0362 204.27)` | Sealegs | black, 5.6 to 1 |
| 43 | `#5f7c81` | `oklch(56.56% 0.0341 210.09)` | North Atlantic | black, 4.6 to 1 |
| 44 | `#546e75` | `oklch(52.12% 0.0321 215.58)` | Blue Sentinel | white, 5.4 to 1 |
| 45 | `#4b626a` | `oklch(47.99% 0.0303 220.62)` | Cone Green Blue | white, 6.4 to 1 |
| 46 | `#43575f` | `oklch(44.32% 0.0287 225.11)` | Asher Benjamin | white, 7.5 to 1 |
| 47 | `#3c4e57` | `oklch(41.26% 0.0273 228.95)` | Presidential | white, 8.6 to 1 |
| 48 | `#374851` | `oklch(38.98% 0.0262 232.02)` | Limed Spruce | white, 9.5 to 1 |

## CSS

```css
background: linear-gradient(135deg, #487b9a 0.0%, #497698 2.1%, #4a6f94 4.3%, #4b668e 6.4%, #4c5c87 8.5%, #4d527e 10.6%, #4e4973 12.8%, #4e4069 14.9%, #4f385e 17.0%, #503254 19.1%, #512e4c 21.3%, #542d45 23.4%, #5a2f41 25.5%, #623440 27.7%, #6c3c42 29.8%, #794845 31.9%, #87564a 34.0%, #956652 36.2%, #a3775a 38.3%, #b08965 40.4%, #bc9b70 42.6%, #c5ac7c 44.7%, #ccba88 46.8%, #d0c793 48.9%, #d0cf9c 51.1%, #d0d6a4 53.2%, #cedcab 55.3%, #cce0b2 57.4%, #cae2b8 59.6%, #c7e3bc 61.7%, #c3e3c0 63.8%, #bfe2c2 66.0%, #badfc3 68.1%, #b5dcc4 70.2%, #afd7c3 72.3%, #a9d1c1 74.5%, #a1cabd 76.6%, #98c0b7 78.7%, #8db4af 80.9%, #82a7a5 83.0%, #76999a 85.1%, #6a8a8e 87.2%, #5f7c81 89.4%, #546e75 91.5%, #4b626a 93.6%, #43575f 95.7%, #3c4e57 97.9%, #374851 100.0%);
background: linear-gradient(135deg in oklch, oklch(55.91% 0.0730 236.95) 0.0%, oklch(54.71% 0.0727 242.61) 2.1%, oklch(52.90% 0.0723 249.72) 4.3%, oklch(50.65% 0.0718 258.06) 6.4%, oklch(48.10% 0.0713 267.44) 8.5%, oklch(45.43% 0.0707 277.61) 10.6%, oklch(42.79% 0.0701 288.39) 12.8%, oklch(40.34% 0.0695 299.54) 14.9%, oklch(38.23% 0.0690 310.86) 17.0%, oklch(36.65% 0.0685 322.12) 19.1%, oklch(35.73% 0.0680 333.12) 21.3%, oklch(35.64% 0.0677 343.64) 23.4%, oklch(36.55% 0.0675 353.50) 25.5%, oklch(38.65% 0.0675 3.32) 27.7%, oklch(41.80% 0.0677 13.34) 29.8%, oklch(45.78% 0.0680 23.48) 31.9%, oklch(50.40% 0.0684 33.65) 34.0%, oklch(55.43% 0.0689 43.79) 36.2%, oklch(60.66% 0.0693 53.80) 38.3%, oklch(65.87% 0.0697 63.61) 40.4%, oklch(70.86% 0.0699 73.13) 42.6%, oklch(75.41% 0.0699 82.30) 44.7%, oklch(79.31% 0.0697 91.02) 46.8%, oklch(82.34% 0.0693 99.22) 48.9%, oklch(84.40% 0.0684 106.82) 51.1%, oklch(85.97% 0.0673 113.83) 53.2%, oklch(87.16% 0.0660 120.33) 55.3%, oklch(87.98% 0.0644 126.40) 57.4%, oklch(88.45% 0.0627 132.10) 59.6%, oklch(88.57% 0.0608 137.52) 61.7%, oklch(88.37% 0.0588 142.72) 63.8%, oklch(87.84% 0.0567 147.80) 66.0%, oklch(87.00% 0.0547 152.82) 68.1%, oklch(85.86% 0.0526 157.86) 70.2%, oklch(84.44% 0.0506 163.00) 72.3%, oklch(82.75% 0.0487 168.31) 74.5%, oklch(80.61% 0.0468 173.89) 76.6%, oklch(77.70% 0.0448 179.78) 78.7%, oklch(74.13% 0.0427 185.86) 80.9%, oklch(70.08% 0.0405 192.05) 83.0%, oklch(65.69% 0.0383 198.22) 85.1%, oklch(61.13% 0.0362 204.27) 87.2%, oklch(56.56% 0.0341 210.09) 89.4%, oklch(52.12% 0.0321 215.58) 91.5%, oklch(47.99% 0.0303 220.62) 93.6%, oklch(44.32% 0.0287 225.11) 95.7%, oklch(41.26% 0.0273 228.95) 97.9%, oklch(38.98% 0.0262 232.02) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.559 | 0.073 | 237 |
| 2 | 0.362 | 0.068 | 351.1 |
| 3 | 0.835 | 0.069 | 463.1 |
| 4 | 0.823 | 0.048 | 529.7 |
| 5 | 0.39 | 0.026 | 592 |

## Other forms

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