# Tritone blue, teal and brown linear gradient

Tritone blue, teal and brown linear gradient with 32 colors: #325a82, #335e84, #366287, #3a688b, #3e6e8f, #427593, #477c97, #4b829a, #4e889b, #528d9b, #58939b, #5f9799, #679c97, #6fa095, #76a393, #7ea691, #84a88e, #8aaa8a, #90ab86, #96ab80, #9dab7a, #a4aa73, #aba96d, #b1a667, #b6a461, #bba05b, #bf9c55, #c2974e, #c49249, #c68e44, #c88a40, #c9873e. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kWdDqxyxi81gTuDbnzj1iu8A`
- Page: https://grabient.com/kWdDqxyxi81gTuDbnzj1iu8A?steps=32
- Drawn as: linear gradient, 32 steps, 90 degrees
- Hues: two-hue
- Contrast of its darkest and lightest colors: 2.9 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 | `#325a82` | `oklch(45.67% 0.0799 249.61)` | Dark Blue | white, 7.1 to 1 |
| 2 | `#335e84` | `oklch(46.76% 0.0789 247.78)` | Pelagic | white, 6.8 to 1 |
| 3 | `#366287` | `oklch(48.25% 0.0776 245.63)` | Atlantic Schooner | white, 6.4 to 1 |
| 4 | `#3a688b` | `oklch(50.02% 0.0761 243.10)` | Drake’s Neck | white, 5.9 to 1 |
| 5 | `#3e6e8f` | `oklch(51.97% 0.0744 240.09)` | Big Sur Blue Jade | white, 5.4 to 1 |
| 6 | `#427593` | `oklch(53.99% 0.0725 236.53)` | Harbour Blue | white, 4.9 to 1 |
| 7 | `#477c97` | `oklch(55.98% 0.0707 232.32)` | Coelin Blue | black, 4.5 to 1 |
| 8 | `#4b829a` | `oklch(57.83% 0.0688 227.40)` | Dirty Blue | black, 4.9 to 1 |
| 9 | `#4e889b` | `oklch(59.44% 0.0671 221.66)` | Hippie Blue | black, 5.3 to 1 |
| 10 | `#528d9b` | `oklch(60.97% 0.0649 214.77)` | Stratford Blue | black, 5.6 to 1 |
| 11 | `#58939b` | `oklch(62.48% 0.0623 206.84)` | Cabana Blue | black, 6 to 1 |
| 12 | `#5f9799` | `oklch(63.95% 0.0595 198.16)` | Loch Blue | black, 6.4 to 1 |
| 13 | `#679c97` | `oklch(65.35% 0.0570 189.02)` | Canton | black, 6.7 to 1 |
| 14 | `#6fa095` | `oklch(66.65% 0.0549 179.72)` | Greyish Teal | black, 7.1 to 1 |
| 15 | `#76a393` | `oklch(67.83% 0.0536 170.54)` | Harmony in Green | black, 7.4 to 1 |
| 16 | `#7ea691` | `oklch(68.85% 0.0533 161.80)` | Verdigreen | black, 7.7 to 1 |
| 17 | `#84a88e` | `oklch(69.69% 0.0545 153.62)` | Catnip | black, 7.9 to 1 |
| 18 | `#8aaa8a` | `oklch(70.40% 0.0570 145.42)` | Alga Moss | black, 8.1 to 1 |
| 19 | `#90ab86` | `oklch(70.98% 0.0605 137.18)` | Flora Green | black, 8.3 to 1 |
| 20 | `#96ab80` | `oklch(71.44% 0.0648 129.04)` | Forest Shade | black, 8.4 to 1 |
| 21 | `#9dab7a` | `oklch(71.77% 0.0696 121.12)` | Siamese Green | black, 8.5 to 1 |
| 22 | `#a4aa73` | `oklch(71.99% 0.0747 113.55)` | Tarragon | black, 8.5 to 1 |
| 23 | `#aba96d` | `oklch(72.09% 0.0797 106.47)` | Organic Garden | black, 8.5 to 1 |
| 24 | `#b1a667` | `oklch(72.07% 0.0843 100.00)` | Natchez Moss | black, 8.5 to 1 |
| 25 | `#b6a461` | `oklch(71.89% 0.0888 94.14)` | Frickles | black, 8.4 to 1 |
| 26 | `#bba05b` | `oklch(71.46% 0.0937 88.66)` | Frickles | black, 8.2 to 1 |
| 27 | `#bf9c55` | `oklch(70.86% 0.0989 83.59)` | Fallow | black, 8 to 1 |
| 28 | `#c2974e` | `oklch(70.15% 0.1040 78.96)` | Where Buffalo Roam | black, 7.8 to 1 |
| 29 | `#c49249` | `oklch(69.40% 0.1089 74.82)` | Narcissus | black, 7.5 to 1 |
| 30 | `#c68e44` | `oklch(68.70% 0.1134 71.21)` | Anzac | black, 7.3 to 1 |
| 31 | `#c88a40` | `oklch(68.11% 0.1171 68.17)` | Golden Leaf | black, 7.1 to 1 |
| 32 | `#c9873e` | `oklch(67.72% 0.1199 65.73)` | Gold Coast | black, 7 to 1 |

## CSS

```css
background: linear-gradient(90deg, #325a82 0.0%, #335e84 3.2%, #366287 6.5%, #3a688b 9.7%, #3e6e8f 12.9%, #427593 16.1%, #477c97 19.4%, #4b829a 22.6%, #4e889b 25.8%, #528d9b 29.0%, #58939b 32.3%, #5f9799 35.5%, #679c97 38.7%, #6fa095 41.9%, #76a393 45.2%, #7ea691 48.4%, #84a88e 51.6%, #8aaa8a 54.8%, #90ab86 58.1%, #96ab80 61.3%, #9dab7a 64.5%, #a4aa73 67.7%, #aba96d 71.0%, #b1a667 74.2%, #b6a461 77.4%, #bba05b 80.6%, #bf9c55 83.9%, #c2974e 87.1%, #c49249 90.3%, #c68e44 93.5%, #c88a40 96.8%, #c9873e 100.0%);
background: linear-gradient(90deg in oklch, oklch(45.67% 0.0799 249.61) 0.0%, oklch(46.76% 0.0789 247.78) 3.2%, oklch(48.25% 0.0776 245.63) 6.5%, oklch(50.02% 0.0761 243.10) 9.7%, oklch(51.97% 0.0744 240.09) 12.9%, oklch(53.99% 0.0725 236.53) 16.1%, oklch(55.98% 0.0707 232.32) 19.4%, oklch(57.83% 0.0688 227.40) 22.6%, oklch(59.44% 0.0671 221.66) 25.8%, oklch(60.97% 0.0649 214.77) 29.0%, oklch(62.48% 0.0623 206.84) 32.3%, oklch(63.95% 0.0595 198.16) 35.5%, oklch(65.35% 0.0570 189.02) 38.7%, oklch(66.65% 0.0549 179.72) 41.9%, oklch(67.83% 0.0536 170.54) 45.2%, oklch(68.85% 0.0533 161.80) 48.4%, oklch(69.69% 0.0545 153.62) 51.6%, oklch(70.40% 0.0570 145.42) 54.8%, oklch(70.98% 0.0605 137.18) 58.1%, oklch(71.44% 0.0648 129.04) 61.3%, oklch(71.77% 0.0696 121.12) 64.5%, oklch(71.99% 0.0747 113.55) 67.7%, oklch(72.09% 0.0797 106.47) 71.0%, oklch(72.07% 0.0843 100.00) 74.2%, oklch(71.89% 0.0888 94.14) 77.4%, oklch(71.46% 0.0937 88.66) 80.6%, oklch(70.86% 0.0989 83.59) 83.9%, oklch(70.15% 0.1040 78.96) 87.1%, oklch(69.40% 0.1089 74.82) 90.3%, oklch(68.70% 0.1134 71.21) 93.5%, oklch(68.11% 0.1171 68.17) 96.8%, oklch(67.72% 0.1199 65.73) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.457 | 0.08 | 249.6 |
| 2 | 0.591 | 0.068 | 223.2 |
| 3 | 0.693 | 0.054 | 157.7 |
| 4 | 0.72 | 0.085 | 98.5 |
| 5 | 0.677 | 0.12 | 65.7 |

## In these collections

- [Library card nostalgia](https://grabient.com/library-card-nostalgia)

## Other forms

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