# Dune Water Passage

The continuous color field travels from #45d9d1 to #df706a, passing through green, olive, gold, orange, ivory, rust, red, rust, orange, gold, olive, green, teal, aqua, blue, magenta, rose, and red. Its gradual transitions provide quiet placement areas and stronger turns for travel headers, resort menus, summer campaigns, or broad coastal backgrounds.

- Also called: Pastel rainbow from teal to salmon linear gradient
- Seed: `kWzVmHeQey24iQBEolAVbNTw`
- Page: https://grabient.com/kWzVmHeQey24iQBEolAVbNTw?steps=32&angle=240
- Drawn as: linear gradient, 32 steps, 240 degrees
- Kinds: pastel, light, rainbow
- Hues: tetradic
- Contrast of its darkest and lightest colors: 4.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 | `#45d9d1` | `oklch(80.71% 0.1226 189.84)` | Jazzy Jade | black, 12.1 to 1 |
| 2 | `#64dcc7` | `oklch(82.04% 0.1132 180.14)` | Jazzy Jade | black, 12.6 to 1 |
| 3 | `#88e0bc` | `oklch(84.01% 0.0992 166.32)` | Sprig of Mint | black, 13.3 to 1 |
| 4 | `#ace2b6` | `oklch(86.36% 0.0825 149.82)` | Celadon | black, 14.3 to 1 |
| 5 | `#cbe4b8` | `oklch(88.84% 0.0649 132.06)` | Iced Avocado | black, 15.3 to 1 |
| 6 | `#e1e6c2` | `oklch(91.23% 0.0481 114.49)` | Tinted Mint | black, 16.3 to 1 |
| 7 | `#eeead0` | `oklch(93.27% 0.0339 98.55)` | Wrack White | black, 17.2 to 1 |
| 8 | `#f5eddc` | `oklch(94.72% 0.0241 85.67)` | White Mountain | black, 17.9 to 1 |
| 9 | `#f8eee1` | `oklch(95.36% 0.0204 77.16)` | Ambient Glow | black, 18.3 to 1 |
| 10 | `#faeee0` | `oklch(95.46% 0.0233 71.23)` | Starglider | black, 18.3 to 1 |
| 11 | `#feecda` | `oklch(95.18% 0.0313 66.96)` | Flowerbed | black, 18.1 to 1 |
| 12 | `#ffe8d4` | `oklch(94.51% 0.0367 64.52)` | Macaroon Cream | black, 17.7 to 1 |
| 13 | `#ffe4cc` | `oklch(93.45% 0.0437 64.03)` | Lumber | black, 17.2 to 1 |
| 14 | `#ffdebf` | `oklch(92.00% 0.0554 65.65)` | Odious Orange | black, 16.4 to 1 |
| 15 | `#ffd7aa` | `oklch(90.15% 0.0737 69.54)` | Peach Cider | black, 15.5 to 1 |
| 16 | `#facf93` | `oklch(87.90% 0.0907 75.84)` | Maple Elixir | black, 14.4 to 1 |
| 17 | `#ebca84` | `oklch(85.09% 0.0957 84.86)` | Marzipan | black, 13.2 to 1 |
| 18 | `#d2c277` | `oklch(81.11% 0.0976 97.33)` | Tropical Moss | black, 11.7 to 1 |
| 19 | `#b2b96e` | `oklch(76.23% 0.0975 112.79)` | Lime Rickey | black, 10 to 1 |
| 20 | `#8dae6d` | `oklch(70.91% 0.0960 130.55)` | Sage | black, 8.3 to 1 |
| 21 | `#65a172` | `oklch(65.61% 0.0941 149.95)` | Treelet | black, 6.9 to 1 |
| 22 | `#3f947a` | `oklch(60.77% 0.0925 170.32)` | Winter Green | black, 5.7 to 1 |
| 23 | `#1b8884` | `oklch(56.86% 0.0918 191.00)` | Tubbataha Teal | black, 4.8 to 1 |
| 24 | `#077e8e` | `oklch(54.31% 0.0930 211.32)` | Metallic Seaweed | white, 4.8 to 1 |
| 25 | `#22769b` | `oklch(53.47% 0.0966 231.98)` | Bateau | white, 5 to 1 |
| 26 | `#4470a9` | `oklch(54.11% 0.1020 255.37)` | Croquet Blue | white, 5 to 1 |
| 27 | `#686bb2` | `oklch(55.83% 0.1088 280.37)` | Mediaeval | white, 4.8 to 1 |
| 28 | `#8c68b2` | `oklch(58.25% 0.1162 305.67)` | Knight Elf | black, 4.7 to 1 |
| 29 | `#ac66a6` | `oklch(61.00% 0.1237 330.01)` | Iris Orchid | black, 5.2 to 1 |
| 30 | `#c66793` | `oklch(63.68% 0.1306 352.08)` | Ibis Rose | black, 5.7 to 1 |
| 31 | `#d76b7e` | `oklch(65.92% 0.1365 10.60)` | Pinkish | black, 6.2 to 1 |
| 32 | `#df706a` | `oklch(67.32% 0.1406 24.29)` | Childhood Crush | black, 6.6 to 1 |

## CSS

```css
background: linear-gradient(240deg, #45d9d1 0.0%, #64dcc7 3.2%, #88e0bc 6.5%, #ace2b6 9.7%, #cbe4b8 12.9%, #e1e6c2 16.1%, #eeead0 19.4%, #f5eddc 22.6%, #f8eee1 25.8%, #faeee0 29.0%, #feecda 32.3%, #ffe8d4 35.5%, #ffe4cc 38.7%, #ffdebf 41.9%, #ffd7aa 45.2%, #facf93 48.4%, #ebca84 51.6%, #d2c277 54.8%, #b2b96e 58.1%, #8dae6d 61.3%, #65a172 64.5%, #3f947a 67.7%, #1b8884 71.0%, #077e8e 74.2%, #22769b 77.4%, #4470a9 80.6%, #686bb2 83.9%, #8c68b2 87.1%, #ac66a6 90.3%, #c66793 93.5%, #d76b7e 96.8%, #df706a 100.0%);
background: linear-gradient(240deg in oklch, oklch(80.71% 0.1226 189.84) 0.0%, oklch(82.04% 0.1132 180.14) 3.2%, oklch(84.01% 0.0992 166.32) 6.5%, oklch(86.36% 0.0825 149.82) 9.7%, oklch(88.84% 0.0649 132.06) 12.9%, oklch(91.23% 0.0481 114.49) 16.1%, oklch(93.27% 0.0339 98.55) 19.4%, oklch(94.72% 0.0241 85.67) 22.6%, oklch(95.36% 0.0204 77.16) 25.8%, oklch(95.46% 0.0233 71.23) 29.0%, oklch(95.18% 0.0313 66.96) 32.3%, oklch(94.51% 0.0367 64.52) 35.5%, oklch(93.45% 0.0437 64.03) 38.7%, oklch(92.00% 0.0554 65.65) 41.9%, oklch(90.15% 0.0737 69.54) 45.2%, oklch(87.90% 0.0907 75.84) 48.4%, oklch(85.09% 0.0957 84.86) 51.6%, oklch(81.11% 0.0976 97.33) 54.8%, oklch(76.23% 0.0975 112.79) 58.1%, oklch(70.91% 0.0960 130.55) 61.3%, oklch(65.61% 0.0941 149.95) 64.5%, oklch(60.77% 0.0925 170.32) 67.7%, oklch(56.86% 0.0918 191.00) 71.0%, oklch(54.31% 0.0930 211.32) 74.2%, oklch(53.47% 0.0966 231.98) 77.4%, oklch(54.11% 0.1020 255.37) 80.6%, oklch(55.83% 0.1088 280.37) 83.9%, oklch(58.25% 0.1162 305.67) 87.1%, oklch(61.00% 0.1237 330.01) 90.3%, oklch(63.68% 0.1306 352.08) 93.5%, oklch(65.92% 0.1365 10.60) 96.8%, oklch(67.32% 0.1406 24.29) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.807 | 0.123 | 189.8 |
| 2 | 0.953 | 0.021 | 78.9 |
| 3 | 0.866 | 0.094 | 79.9 |
| 4 | 0.539 | 0.094 | 216.3 |
| 5 | 0.673 | 0.141 | 384.3 |

## In these collections

- [Beach gradients](https://grabient.com/beach-gradients)

## Other forms

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