# Blue, gray and brown linear gradient

Blue, gray and brown linear gradient with 32 colors: #275b9a, #27619b, #2b6a9c, #33749c, #3e7e9c, #4a889c, #55909c, #5e989b, #699f99, #75a695, #84ac91, #92b08c, #9eb288, #a7b284, #afb27e, #b4b177, #b9ae6f, #bbab66, #bca65e, #baa056, #b69950, #af9149, #a68942, #9c803b, #917735, #866e2e, #7a6429, #6b5a23, #5d4f1e, #504519, #453d15, #3e3713. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kYd1W1zxc6l4XNdbo7wRqA_iqTwQ`
- Page: https://grabient.com/kYd1W1zxc6l4XNdbo7wRqA_iqTwQ?steps=32
- Drawn as: linear gradient, 32 steps, 90 degrees
- Kinds: light center, vivid
- 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 | `#275b9a` | `oklch(46.85% 0.1171 255.23)` | Beacon Blue | white, 6.9 to 1 |
| 2 | `#27619b` | `oklch(48.49% 0.1109 250.92)` | Lapis Lazuli | white, 6.3 to 1 |
| 3 | `#2b6a9c` | `oklch(50.79% 0.1019 245.35)` | Blues | white, 5.7 to 1 |
| 4 | `#33749c` | `oklch(53.50% 0.0913 238.60)` | Male Betta | white, 5 to 1 |
| 5 | `#3e7e9c` | `oklch(56.39% 0.0807 230.73)` | Linoleum Blue | black, 4.6 to 1 |
| 6 | `#4a889c` | `oklch(59.22% 0.0712 221.80)` | Hippie Blue | black, 5.2 to 1 |
| 7 | `#55909c` | `oklch(61.76% 0.0643 211.89)` | Cabana Blue | black, 5.8 to 1 |
| 8 | `#5e989b` | `oklch(64.00% 0.0605 200.33)` | Loch Blue | black, 6.4 to 1 |
| 9 | `#699f99` | `oklch(66.30% 0.0584 186.30)` | Folk Song | black, 7 to 1 |
| 10 | `#75a695` | `oklch(68.55% 0.0578 170.91)` | Free Green | black, 7.6 to 1 |
| 11 | `#84ac91` | `oklch(70.61% 0.0584 155.33)` | Nature Green | black, 8.2 to 1 |
| 12 | `#92b08c` | `oklch(72.35% 0.0600 140.74)` | Fair Green | black, 8.7 to 1 |
| 13 | `#9eb288` | `oklch(73.65% 0.0623 128.31)` | Easy Green | black, 9.1 to 1 |
| 14 | `#a7b284` | `oklch(74.43% 0.0655 118.82)` | Great Green | black, 9.3 to 1 |
| 15 | `#afb27e` | `oklch(74.85% 0.0709 111.26)` | Weeping Willow | black, 9.5 to 1 |
| 16 | `#b4b177` | `oklch(74.91% 0.0776 105.21)` | Weeping Willow | black, 9.4 to 1 |
| 17 | `#b9ae6f` | `oklch(74.61% 0.0847 100.39)` | Jalapeño Jelly | black, 9.3 to 1 |
| 18 | `#bbab66` | `oklch(73.93% 0.0912 96.48)` | Swampwater | black, 9.1 to 1 |
| 19 | `#bca65e` | `oklch(72.87% 0.0961 93.22)` | Nonpareil Apple | black, 8.7 to 1 |
| 20 | `#baa056` | `oklch(71.40% 0.0985 90.37)` | Woollen Mittens | black, 8.2 to 1 |
| 21 | `#b69950` | `oklch(69.41% 0.0991 88.47)` | Viva Las Vegas | black, 7.6 to 1 |
| 22 | `#af9149` | `oklch(66.96% 0.0984 87.48)` | Epidote Olvene Ore | black, 6.9 to 1 |
| 23 | `#a68942` | `oklch(64.17% 0.0967 87.18)` | Peanut Brittle | black, 6.2 to 1 |
| 24 | `#9c803b` | `oklch(61.15% 0.0941 87.38)` | Wild Olive | black, 5.5 to 1 |
| 25 | `#917735` | `oklch(58.02% 0.0910 87.84)` | Banyan Tree | black, 4.8 to 1 |
| 26 | `#866e2e` | `oklch(54.87% 0.0874 88.39)` | Aged Antics | white, 4.8 to 1 |
| 27 | `#7a6429` | `oklch(51.26% 0.0826 89.45)` | Brazen Brass | white, 5.6 to 1 |
| 28 | `#6b5a23` | `oklch(47.20% 0.0764 91.09)` | Bean Green | white, 6.7 to 1 |
| 29 | `#5d4f1e` | `oklch(43.04% 0.0697 93.02)` | Bronze Olive | white, 8 to 1 |
| 30 | `#504519` | `oklch(39.14% 0.0632 94.97)` | Uniform Green | white, 9.5 to 1 |
| 31 | `#453d15` | `oklch(35.83% 0.0576 96.65)` | Madras | white, 10.9 to 1 |
| 32 | `#3e3713` | `oklch(33.46% 0.0537 97.78)` | Camouflage | white, 11.9 to 1 |

## CSS

```css
background: linear-gradient(90deg, #275b9a 0.0%, #27619b 3.2%, #2b6a9c 6.5%, #33749c 9.7%, #3e7e9c 12.9%, #4a889c 16.1%, #55909c 19.4%, #5e989b 22.6%, #699f99 25.8%, #75a695 29.0%, #84ac91 32.3%, #92b08c 35.5%, #9eb288 38.7%, #a7b284 41.9%, #afb27e 45.2%, #b4b177 48.4%, #b9ae6f 51.6%, #bbab66 54.8%, #bca65e 58.1%, #baa056 61.3%, #b69950 64.5%, #af9149 67.7%, #a68942 71.0%, #9c803b 74.2%, #917735 77.4%, #866e2e 80.6%, #7a6429 83.9%, #6b5a23 87.1%, #5d4f1e 90.3%, #504519 93.5%, #453d15 96.8%, #3e3713 100.0%);
background: linear-gradient(90deg in oklch, oklch(46.85% 0.1171 255.23) 0.0%, oklch(48.49% 0.1109 250.92) 3.2%, oklch(50.79% 0.1019 245.35) 6.5%, oklch(53.50% 0.0913 238.60) 9.7%, oklch(56.39% 0.0807 230.73) 12.9%, oklch(59.22% 0.0712 221.80) 16.1%, oklch(61.76% 0.0643 211.89) 19.4%, oklch(64.00% 0.0605 200.33) 22.6%, oklch(66.30% 0.0584 186.30) 25.8%, oklch(68.55% 0.0578 170.91) 29.0%, oklch(70.61% 0.0584 155.33) 32.3%, oklch(72.35% 0.0600 140.74) 35.5%, oklch(73.65% 0.0623 128.31) 38.7%, oklch(74.43% 0.0655 118.82) 41.9%, oklch(74.85% 0.0709 111.26) 45.2%, oklch(74.91% 0.0776 105.21) 48.4%, oklch(74.61% 0.0847 100.39) 51.6%, oklch(73.93% 0.0912 96.48) 54.8%, oklch(72.87% 0.0961 93.22) 58.1%, oklch(71.40% 0.0985 90.37) 61.3%, oklch(69.41% 0.0991 88.47) 64.5%, oklch(66.96% 0.0984 87.48) 67.7%, oklch(64.17% 0.0967 87.18) 71.0%, oklch(61.15% 0.0941 87.38) 74.2%, oklch(58.02% 0.0910 87.84) 77.4%, oklch(54.87% 0.0874 88.39) 80.6%, oklch(51.26% 0.0826 89.45) 83.9%, oklch(47.20% 0.0764 91.09) 87.1%, oklch(43.04% 0.0697 93.02) 90.3%, oklch(39.14% 0.0632 94.97) 93.5%, oklch(35.83% 0.0576 96.65) 96.8%, oklch(33.46% 0.0537 97.78) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.469 | 0.117 | 255.2 |
| 2 | 0.622 | 0.063 | 209.8 |
| 3 | 0.74 | 0.063 | 124.2 |
| 4 | 0.72 | 0.098 | 91.4 |
| 5 | 0.555 | 0.088 | 88.3 |
| 6 | 0.335 | 0.054 | 97.8 |

## In these collections

- [Alpine copper kitchen](https://grabient.com/alpine-copper-kitchen)

## Other forms

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