# Duotone teal to brown linear gradient

Duotone teal to brown linear gradient with 32 colors: #155c6f, #145c6e, #145d6e, #135e6d, #135f6c, #13606a, #136169, #156268, #166366, #196464, #1b6563, #1f6561, #22665f, #26675d, #29685b, #2d6959, #316956, #366a54, #3a6b52, #406b4f, #456c4c, #4a6c4a, #506c47, #556c45, #5b6c43, #606c41, #646c40, #696c3f, #6c6c3f, #706c3e, #736c3e, #756c3f. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kScDWdPJi6EMXt0`
- Page: https://grabient.com/kScDWdPJi6EMXt0?steps=32&angle=180
- Drawn as: linear gradient, 32 steps, 180 degrees
- Kinds: even lightness, vivid
- Hues: wide
- Contrast of its darkest and lightest colors: 1.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 | `#155c6f` | `oklch(44.09% 0.0730 220.78)` | Deep Blue Sea | white, 7.5 to 1 |
| 2 | `#145c6e` | `oklch(44.22% 0.0728 219.02)` | Connor’s Lakefront | white, 7.5 to 1 |
| 3 | `#145d6e` | `oklch(44.37% 0.0726 216.97)` | Galapagos | white, 7.4 to 1 |
| 4 | `#135e6d` | `oklch(44.53% 0.0723 214.65)` | Galapagos | white, 7.3 to 1 |
| 5 | `#135f6c` | `oklch(44.72% 0.0719 212.07)` | Galapagos | white, 7.3 to 1 |
| 6 | `#13606a` | `oklch(44.92% 0.0716 209.26)` | Turkish Aqua | white, 7.2 to 1 |
| 7 | `#136169` | `oklch(45.14% 0.0712 206.23)` | Turkish Aqua | white, 7.1 to 1 |
| 8 | `#156268` | `oklch(45.37% 0.0708 203.02)` | Caribbean Swim | white, 7 to 1 |
| 9 | `#166366` | `oklch(45.61% 0.0703 199.65)` | Caribbean Swim | white, 7 to 1 |
| 10 | `#196464` | `oklch(45.86% 0.0699 196.12)` | Abduction | white, 6.9 to 1 |
| 11 | `#1b6563` | `oklch(46.12% 0.0695 192.47)` | Abduction | white, 6.8 to 1 |
| 12 | `#1f6561` | `oklch(46.39% 0.0691 188.72)` | Abduction | white, 6.7 to 1 |
| 13 | `#22665f` | `oklch(46.66% 0.0687 184.88)` | Alliance | white, 6.6 to 1 |
| 14 | `#26675d` | `oklch(46.94% 0.0683 180.99)` | Galapagos Green | white, 6.5 to 1 |
| 15 | `#29685b` | `oklch(47.22% 0.0680 177.05)` | Galapagos Green | white, 6.5 to 1 |
| 16 | `#2d6959` | `oklch(47.50% 0.0677 173.09)` | Terrestrial | white, 6.4 to 1 |
| 17 | `#316956` | `oklch(47.78% 0.0674 169.08)` | Terrestrial | white, 6.3 to 1 |
| 18 | `#366a54` | `oklch(48.09% 0.0671 164.67)` | Toad King | white, 6.2 to 1 |
| 19 | `#3a6b52` | `oklch(48.43% 0.0669 159.88)` | Toad King | white, 6.1 to 1 |
| 20 | `#406b4f` | `oklch(48.79% 0.0667 154.78)` | Nordic Pine | white, 6.1 to 1 |
| 21 | `#456c4c` | `oklch(49.16% 0.0664 149.46)` | Sabal Palm | white, 6 to 1 |
| 22 | `#4a6c4a` | `oklch(49.55% 0.0662 144.00)` | Garden Cucumber | white, 5.9 to 1 |
| 23 | `#506c47` | `oklch(49.93% 0.0660 138.46)` | Graceland Grass | white, 5.8 to 1 |
| 24 | `#556c45` | `oklch(50.32% 0.0658 132.92)` | Graceland Grass | white, 5.7 to 1 |
| 25 | `#5b6c43` | `oklch(50.70% 0.0657 127.48)` | Bonza Green | white, 5.6 to 1 |
| 26 | `#606c41` | `oklch(51.07% 0.0655 122.19)` | Pandanus | white, 5.6 to 1 |
| 27 | `#646c40` | `oklch(51.43% 0.0654 117.14)` | Pandanus | white, 5.5 to 1 |
| 28 | `#696c3f` | `oklch(51.76% 0.0652 112.41)` | Coconut Grove | white, 5.4 to 1 |
| 29 | `#6c6c3f` | `oklch(52.06% 0.0651 108.07)` | Robinhood | white, 5.4 to 1 |
| 30 | `#706c3e` | `oklch(52.33% 0.0650 104.21)` | Trough Shell | white, 5.3 to 1 |
| 31 | `#736c3e` | `oklch(52.57% 0.0649 100.89)` | Trough Shell | white, 5.3 to 1 |
| 32 | `#756c3f` | `oklch(52.76% 0.0648 98.20)` | Trough Shell | white, 5.3 to 1 |

## CSS

```css
background: linear-gradient(180deg, #155c6f 0.0%, #145c6e 3.2%, #145d6e 6.5%, #135e6d 9.7%, #135f6c 12.9%, #13606a 16.1%, #136169 19.4%, #156268 22.6%, #166366 25.8%, #196464 29.0%, #1b6563 32.3%, #1f6561 35.5%, #22665f 38.7%, #26675d 41.9%, #29685b 45.2%, #2d6959 48.4%, #316956 51.6%, #366a54 54.8%, #3a6b52 58.1%, #406b4f 61.3%, #456c4c 64.5%, #4a6c4a 67.7%, #506c47 71.0%, #556c45 74.2%, #5b6c43 77.4%, #606c41 80.6%, #646c40 83.9%, #696c3f 87.1%, #6c6c3f 90.3%, #706c3e 93.5%, #736c3e 96.8%, #756c3f 100.0%);
background: linear-gradient(180deg in oklch, oklch(44.09% 0.0730 220.78) 0.0%, oklch(44.22% 0.0728 219.02) 3.2%, oklch(44.37% 0.0726 216.97) 6.5%, oklch(44.53% 0.0723 214.65) 9.7%, oklch(44.72% 0.0719 212.07) 12.9%, oklch(44.92% 0.0716 209.26) 16.1%, oklch(45.14% 0.0712 206.23) 19.4%, oklch(45.37% 0.0708 203.02) 22.6%, oklch(45.61% 0.0703 199.65) 25.8%, oklch(45.86% 0.0699 196.12) 29.0%, oklch(46.12% 0.0695 192.47) 32.3%, oklch(46.39% 0.0691 188.72) 35.5%, oklch(46.66% 0.0687 184.88) 38.7%, oklch(46.94% 0.0683 180.99) 41.9%, oklch(47.22% 0.0680 177.05) 45.2%, oklch(47.50% 0.0677 173.09) 48.4%, oklch(47.78% 0.0674 169.08) 51.6%, oklch(48.09% 0.0671 164.67) 54.8%, oklch(48.43% 0.0669 159.88) 58.1%, oklch(48.79% 0.0667 154.78) 61.3%, oklch(49.16% 0.0664 149.46) 64.5%, oklch(49.55% 0.0662 144.00) 67.7%, oklch(49.93% 0.0660 138.46) 71.0%, oklch(50.32% 0.0658 132.92) 74.2%, oklch(50.70% 0.0657 127.48) 77.4%, oklch(51.07% 0.0655 122.19) 80.6%, oklch(51.43% 0.0654 117.14) 83.9%, oklch(51.76% 0.0652 112.41) 87.1%, oklch(52.06% 0.0651 108.07) 90.3%, oklch(52.33% 0.0650 104.21) 93.5%, oklch(52.57% 0.0649 100.89) 96.8%, oklch(52.76% 0.0648 98.20) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.441 | 0.073 | 220.8 |
| 2 | 0.476 | 0.068 | 171.1 |
| 3 | 0.528 | 0.065 | 98.2 |

## In these collections

- [App background gradients](https://grabient.com/app-background-gradients)
- [Chalkboard classroom](https://grabient.com/chalkboard-classroom)

## Other forms

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