# Ember Estuary Passage

The gradient travels from #d9592a to #4f7468, passing through red, orange, gold, green, teal, cyan, teal, green, yellow, orange, red, orange, gold, yellow, green, and teal. The alternating cool and warm regions support energetic headers, event graphics, or editorial backgrounds that need teal structure and orange emphasis across the complete route.

- Also called: Orange, teal, tan and gray linear gradient
- Seed: `kWnnwcOBnUUMgPxsnC5QxFNw`
- Page: https://grabient.com/kWnnwcOBnUUMgPxsnC5QxFNw?steps=32&angle=135
- Drawn as: linear gradient, 32 steps, 135 degrees
- Kinds: vivid, multicolor
- Hues: wide
- Contrast of its darkest and lightest colors: 4.8 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 | `#d9592a` | `oklch(62.20% 0.1709 39.38)` | Lāl Red | black, 5.4 to 1 |
| 2 | `#c46400` | `oklch(60.56% 0.1510 54.45)` | Alloy Orange | black, 5.1 to 1 |
| 3 | `#a36f00` | `oklch(58.16% 0.1222 76.01)` | Golden Hind | black, 4.8 to 1 |
| 4 | `#817400` | `oklch(55.28% 0.1157 101.77)` | Tool Green | white, 4.7 to 1 |
| 5 | `#537624` | `oklch(52.23% 0.1174 129.45)` | Luscious Lemongrass | white, 5.2 to 1 |
| 6 | `#227249` | `oklch(49.28% 0.1013 156.77)` | Felt | white, 5.8 to 1 |
| 7 | `#00695d` | `oklch(46.73% 0.0840 181.48)` | Bella Vista | white, 6.5 to 1 |
| 8 | `#026166` | `oklch(44.87% 0.0758 201.32)` | Beau Vert | white, 7.2 to 1 |
| 9 | `#175c6a` | `oklch(43.96% 0.0691 214.17)` | Connor’s Lakefront | white, 7.5 to 1 |
| 10 | `#1f5a6c` | `oklch(43.71% 0.0668 222.17)` | Blue Coral | white, 7.6 to 1 |
| 11 | `#225a6f` | `oklch(43.93% 0.0677 226.85)` | Blue Coral | white, 7.6 to 1 |
| 12 | `#215c73` | `oklch(44.61% 0.0709 228.45)` | Deep Blue Sea | white, 7.4 to 1 |
| 13 | `#1e5f78` | `oklch(45.72% 0.0754 227.23)` | Holiday Velvet | white, 7 to 1 |
| 14 | `#17657d` | `oklch(47.24% 0.0804 223.43)` | Georgian Bay | white, 6.5 to 1 |
| 15 | `#0d6c80` | `oklch(49.16% 0.0848 217.29)` | Azure Green Blue | white, 6 to 1 |
| 16 | `#057582` | `oklch(51.47% 0.0876 209.05)` | Deep Current | white, 5.4 to 1 |
| 17 | `#137f82` | `oklch(54.31% 0.0883 198.09)` | Teal | white, 4.7 to 1 |
| 18 | `#328d7e` | `oklch(58.56% 0.0882 180.28)` | Perky | black, 5.2 to 1 |
| 19 | `#5c9c76` | `oklch(63.82% 0.0875 157.26)` | Memphis Green | black, 6.4 to 1 |
| 20 | `#89a870` | `oklch(69.54% 0.0863 131.66)` | Wyvern Green | black, 7.9 to 1 |
| 21 | `#b5b272` | `oklch(75.12% 0.0846 106.12)` | Rodham | black, 9.5 to 1 |
| 22 | `#d8ba80` | `oklch(80.01% 0.0826 83.25)` | Honeymoon | black, 11.1 to 1 |
| 23 | `#eebf92` | `oklch(83.61% 0.0804 65.70)` | Golden Oat Coloured | black, 12.5 to 1 |
| 24 | `#f7c29e` | `oklch(85.35% 0.0778 56.08)` | Almond Cream | black, 13.2 to 1 |
| 25 | `#f3c19e` | `oklch(84.71% 0.0749 56.56)` | Almond Cream | black, 12.9 to 1 |
| 26 | `#e4bb93` | `oklch(81.83% 0.0710 66.01)` | Fresh Praline | black, 11.8 to 1 |
| 27 | `#cbb285` | `oklch(77.34% 0.0666 81.95)` | Oak Harbour | black, 10.2 to 1 |
| 28 | `#aca679` | `oklch(71.86% 0.0619 101.91)` | Olive Tree | black, 8.4 to 1 |
| 29 | `#8b9972` | `oklch(66.03% 0.0573 123.42)` | Sweet Florence | black, 6.8 to 1 |
| 30 | `#6f8a6e` | `oklch(60.48% 0.0530 144.01)` | Wonderland | black, 5.5 to 1 |
| 31 | `#5a7d6b` | `oklch(55.85% 0.0494 161.20)` | Stone Cypress Green | black, 4.5 to 1 |
| 32 | `#4f7468` | `oklch(52.76% 0.0469 172.53)` | Smoky Emerald | white, 5.2 to 1 |

## CSS

```css
background: linear-gradient(135deg, #d9592a 0.0%, #c46400 3.2%, #a36f00 6.5%, #817400 9.7%, #537624 12.9%, #227249 16.1%, #00695d 19.4%, #026166 22.6%, #175c6a 25.8%, #1f5a6c 29.0%, #225a6f 32.3%, #215c73 35.5%, #1e5f78 38.7%, #17657d 41.9%, #0d6c80 45.2%, #057582 48.4%, #137f82 51.6%, #328d7e 54.8%, #5c9c76 58.1%, #89a870 61.3%, #b5b272 64.5%, #d8ba80 67.7%, #eebf92 71.0%, #f7c29e 74.2%, #f3c19e 77.4%, #e4bb93 80.6%, #cbb285 83.9%, #aca679 87.1%, #8b9972 90.3%, #6f8a6e 93.5%, #5a7d6b 96.8%, #4f7468 100.0%);
background: linear-gradient(135deg in oklch, oklch(62.20% 0.1709 39.38) 0.0%, oklch(60.56% 0.1510 54.45) 3.2%, oklch(58.16% 0.1222 76.01) 6.5%, oklch(55.28% 0.1157 101.77) 9.7%, oklch(52.23% 0.1174 129.45) 12.9%, oklch(49.28% 0.1013 156.77) 16.1%, oklch(46.73% 0.0840 181.48) 19.4%, oklch(44.87% 0.0758 201.32) 22.6%, oklch(43.96% 0.0691 214.17) 25.8%, oklch(43.71% 0.0668 222.17) 29.0%, oklch(43.93% 0.0677 226.85) 32.3%, oklch(44.61% 0.0709 228.45) 35.5%, oklch(45.72% 0.0754 227.23) 38.7%, oklch(47.24% 0.0804 223.43) 41.9%, oklch(49.16% 0.0848 217.29) 45.2%, oklch(51.47% 0.0876 209.05) 48.4%, oklch(54.31% 0.0883 198.09) 51.6%, oklch(58.56% 0.0882 180.28) 54.8%, oklch(63.82% 0.0875 157.26) 58.1%, oklch(69.54% 0.0863 131.66) 61.3%, oklch(75.12% 0.0846 106.12) 64.5%, oklch(80.01% 0.0826 83.25) 67.7%, oklch(83.61% 0.0804 65.70) 71.0%, oklch(85.35% 0.0778 56.08) 74.2%, oklch(84.71% 0.0749 56.56) 77.4%, oklch(81.83% 0.0710 66.01) 80.6%, oklch(77.34% 0.0666 81.95) 83.9%, oklch(71.86% 0.0619 101.91) 87.1%, oklch(66.03% 0.0573 123.42) 90.3%, oklch(60.48% 0.0530 144.01) 93.5%, oklch(55.85% 0.0494 161.20) 96.8%, oklch(52.76% 0.0469 172.53) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.622 | 0.171 | 39.4 |
| 2 | 0.441 | 0.07 | 211.6 |
| 3 | 0.528 | 0.088 | 204.2 |
| 4 | 0.854 | 0.077 | 55.2 |
| 5 | 0.528 | 0.047 | 172.5 |

## In these collections

- [Teal and orange](https://grabient.com/teal-and-orange)

## Other forms

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