# Triadic blue, purple and tan linear gradient

Triadic blue, purple and tan linear gradient with 32 colors: #2b7cab, #2b78a7, #2973a2, #286c9b, #296695, #2d618f, #335c89, #395883, #3f557c, #455276, #4b5071, #524f6e, #5b4e6c, #654f68, #6f5064, #775360, #7e565e, #875a5d, #905d5c, #9a625c, #a2665c, #aa6c5c, #b0725e, #b77961, #bc8064, #c18768, #c58e6b, #c7966f, #c99d73, #c9a578, #caab7d, #cab081. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kajk2qPKHBDgTw6-k0mSp5DteeQjhmUNg`
- Page: https://grabient.com/kajk2qPKHBDgTw6-k0mSp5DteeQjhmUNg?steps=32&angle=135
- Drawn as: linear gradient, 32 steps, 135 degrees
- Kinds: dark center, muted
- Hues: complementary
- Contrast of its darkest and lightest colors: 3.7 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 | `#2b7cab` | `oklch(55.91% 0.1061 239.06)` | Vermeer Blue | white, 4.5 to 1 |
| 2 | `#2b78a7` | `oklch(54.75% 0.1047 239.97)` | In the Mood | white, 4.8 to 1 |
| 3 | `#2973a2` | `oklch(53.09% 0.1029 241.03)` | Deep Water | white, 5.1 to 1 |
| 4 | `#286c9b` | `oklch(51.19% 0.1006 242.53)` | Blues | white, 5.6 to 1 |
| 5 | `#296695` | `oklch(49.35% 0.0974 244.74)` | Starry Night | white, 6.1 to 1 |
| 6 | `#2d618f` | `oklch(47.84% 0.0931 247.93)` | Make-Up Blue | white, 6.5 to 1 |
| 7 | `#335c89` | `oklch(46.70% 0.0871 251.89)` | Moroccan Resort | white, 6.8 to 1 |
| 8 | `#395883` | `oklch(45.68% 0.0790 256.17)` | Handsome Blue | white, 7.2 to 1 |
| 9 | `#3f557c` | `oklch(44.84% 0.0700 261.34)` | Deep Azure | white, 7.5 to 1 |
| 10 | `#455276` | `oklch(44.28% 0.0617 268.02)` | Astronaut | white, 7.7 to 1 |
| 11 | `#4b5071` | `oklch(44.07% 0.0552 276.79)` | Independence | white, 7.8 to 1 |
| 12 | `#524f6e` | `oklch(44.30% 0.0515 288.70)` | Pango Black | white, 7.7 to 1 |
| 13 | `#5b4e6c` | `oklch(44.95% 0.0494 304.60)` | Crowning | white, 7.6 to 1 |
| 14 | `#654f68` | `oklch(45.93% 0.0487 322.47)` | Blackberry Farm | white, 7.3 to 1 |
| 15 | `#6f5064` | `oklch(47.15% 0.0493 340.17)` | Hibernation | white, 6.9 to 1 |
| 16 | `#775360` | `oklch(48.51% 0.0511 355.52)` | Opium Mauve | white, 6.5 to 1 |
| 17 | `#7e565e` | `oklch(49.95% 0.0542 6.73)` | Rose Branch | white, 6.1 to 1 |
| 18 | `#875a5d` | `oklch(51.62% 0.0598 14.86)` | Rabbit Paws | white, 5.7 to 1 |
| 19 | `#905d5c` | `oklch(53.46% 0.0668 20.95)` | Rose Taupe | white, 5.3 to 1 |
| 20 | `#9a625c` | `oklch(55.40% 0.0740 25.81)` | Roulette | white, 4.9 to 1 |
| 21 | `#a2665c` | `oklch(57.37% 0.0800 30.24)` | Sun Baked Earth | black, 4.6 to 1 |
| 22 | `#aa6c5c` | `oklch(59.30% 0.0836 34.91)` | Amaretto | black, 4.9 to 1 |
| 23 | `#b0725e` | `oklch(61.31% 0.0852 38.90)` | Pinkish Brown | black, 5.4 to 1 |
| 24 | `#b77961` | `oklch(63.36% 0.0855 42.21)` | Myrtle Pepper | black, 5.8 to 1 |
| 25 | `#bc8064` | `oklch(65.41% 0.0849 45.35)` | Sundial | black, 6.4 to 1 |
| 26 | `#c18768` | `oklch(67.37% 0.0838 48.84)` | Toasted Nut | black, 6.9 to 1 |
| 27 | `#c58e6b` | `oklch(69.19% 0.0824 53.18)` | Shiracha Brown | black, 7.4 to 1 |
| 28 | `#c7966f` | `oklch(70.99% 0.0802 58.92)` | Sonora Shade | black, 7.9 to 1 |
| 29 | `#c99d73` | `oklch(72.77% 0.0772 65.54)` | Gingersnap | black, 8.5 to 1 |
| 30 | `#c9a578` | `oklch(74.40% 0.0739 72.17)` | Golden Thistle Yellow | black, 9.1 to 1 |
| 31 | `#caab7d` | `oklch(75.78% 0.0709 77.93)` | Downing Straw | black, 9.6 to 1 |
| 32 | `#cab081` | `oklch(76.77% 0.0689 81.96)` | Gold Perennial | black, 10 to 1 |

## CSS

```css
background: linear-gradient(135deg, #2b7cab 0.0%, #2b78a7 3.2%, #2973a2 6.5%, #286c9b 9.7%, #296695 12.9%, #2d618f 16.1%, #335c89 19.4%, #395883 22.6%, #3f557c 25.8%, #455276 29.0%, #4b5071 32.3%, #524f6e 35.5%, #5b4e6c 38.7%, #654f68 41.9%, #6f5064 45.2%, #775360 48.4%, #7e565e 51.6%, #875a5d 54.8%, #905d5c 58.1%, #9a625c 61.3%, #a2665c 64.5%, #aa6c5c 67.7%, #b0725e 71.0%, #b77961 74.2%, #bc8064 77.4%, #c18768 80.6%, #c58e6b 83.9%, #c7966f 87.1%, #c99d73 90.3%, #c9a578 93.5%, #caab7d 96.8%, #cab081 100.0%);
background: linear-gradient(135deg in oklch, oklch(55.91% 0.1061 239.06) 0.0%, oklch(54.75% 0.1047 239.97) 3.2%, oklch(53.09% 0.1029 241.03) 6.5%, oklch(51.19% 0.1006 242.53) 9.7%, oklch(49.35% 0.0974 244.74) 12.9%, oklch(47.84% 0.0931 247.93) 16.1%, oklch(46.70% 0.0871 251.89) 19.4%, oklch(45.68% 0.0790 256.17) 22.6%, oklch(44.84% 0.0700 261.34) 25.8%, oklch(44.28% 0.0617 268.02) 29.0%, oklch(44.07% 0.0552 276.79) 32.3%, oklch(44.30% 0.0515 288.70) 35.5%, oklch(44.95% 0.0494 304.60) 38.7%, oklch(45.93% 0.0487 322.47) 41.9%, oklch(47.15% 0.0493 340.17) 45.2%, oklch(48.51% 0.0511 355.52) 48.4%, oklch(49.95% 0.0542 6.73) 51.6%, oklch(51.62% 0.0598 14.86) 54.8%, oklch(53.46% 0.0668 20.95) 58.1%, oklch(55.40% 0.0740 25.81) 61.3%, oklch(57.37% 0.0800 30.24) 64.5%, oklch(59.30% 0.0836 34.91) 67.7%, oklch(61.31% 0.0852 38.90) 71.0%, oklch(63.36% 0.0855 42.21) 74.2%, oklch(65.41% 0.0849 45.35) 77.4%, oklch(67.37% 0.0838 48.84) 80.6%, oklch(69.19% 0.0824 53.18) 83.9%, oklch(70.99% 0.0802 58.92) 87.1%, oklch(72.77% 0.0772 65.54) 90.3%, oklch(74.40% 0.0739 72.17) 93.5%, oklch(75.78% 0.0709 77.93) 96.8%, oklch(76.77% 0.0689 81.96) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.559 | 0.106 | 239.1 |
| 2 | 0.476 | 0.092 | 248.6 |
| 3 | 0.441 | 0.054 | 280.3 |
| 4 | 0.492 | 0.052 | 361.6 |
| 5 | 0.587 | 0.083 | 393.3 |
| 6 | 0.689 | 0.083 | 412.4 |
| 7 | 0.768 | 0.069 | 442 |

## In these collections

- [Late summer lake haze](https://grabient.com/late-summer-lake-haze)

## Other forms

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