# Deep Lagoon Sun

Across the frame, the gradient travels from #f3cd8b to #df706b, passing through rust, orange, olive, green, teal, aqua, teal, green, olive, orange, rust, 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: Tan, blue, teal and salmon linear gradient
- Seed: `kW3EQ5NSPU0SiOzuITuVbMtg`
- Page: https://grabient.com/kW3EQ5NSPU0SiOzuITuVbMtg?steps=32&angle=135
- Drawn as: linear gradient, 32 steps, 135 degrees
- Kinds: dark center, vivid
- Hues: multi-hue
- Contrast of its darkest and lightest colors: 6.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 | `#f3cd8b` | `oklch(86.61% 0.0937 80.16)` | Warm Glow | black, 13.9 to 1 |
| 2 | `#d8c67e` | `oklch(82.61% 0.0941 95.86)` | Germania | black, 12.3 to 1 |
| 3 | `#adbc76` | `oklch(76.81% 0.0947 118.52)` | Green Curry | black, 10.2 to 1 |
| 4 | `#77ae7a` | `oklch(69.88% 0.0954 145.59)` | Abomination | black, 8.1 to 1 |
| 5 | `#3b9a84` | `oklch(62.48% 0.0961 174.54)` | Green Jelly | black, 6.1 to 1 |
| 6 | `#00828b` | `oklch(55.27% 0.0941 202.85)` | Precious Blue | white, 4.6 to 1 |
| 7 | `#006a8a` | `oklch(48.89% 0.0953 227.99)` | Techno Blue | white, 6.1 to 1 |
| 8 | `#1c5685` | `oklch(44.01% 0.0977 247.36)` | Stunning Sapphire | white, 7.7 to 1 |
| 9 | `#284a7f` | `oklch(41.25% 0.0978 258.61)` | Nautical | white, 8.7 to 1 |
| 10 | `#2a467d` | `oklch(40.24% 0.0976 262.41)` | Sodalite Blue | white, 9.2 to 1 |
| 11 | `#29487d` | `oklch(40.49% 0.0972 260.72)` | Nautical | white, 9.1 to 1 |
| 12 | `#244d80` | `oklch(41.77% 0.0966 254.95)` | Night Mode | white, 8.5 to 1 |
| 13 | `#1c5684` | `oklch(43.84% 0.0959 246.51)` | Stunning Sapphire | white, 7.7 to 1 |
| 14 | `#106088` | `oklch(46.47% 0.0952 236.83)` | Ink Blotch | white, 6.8 to 1 |
| 15 | `#046b8b` | `oklch(49.42% 0.0945 227.32)` | Techno Blue | white, 5.9 to 1 |
| 16 | `#05768f` | `oklch(52.46% 0.0939 219.40)` | Enamel Blue | white, 5.2 to 1 |
| 17 | `#148195` | `oklch(55.57% 0.0934 214.23)` | Pagoda Blue | black, 4.5 to 1 |
| 18 | `#298e9f` | `oklch(59.76% 0.0923 210.91)` | Scooter | black, 5.4 to 1 |
| 19 | `#3d9eac` | `oklch(64.79% 0.0909 208.48)` | Teal Glacier | black, 6.6 to 1 |
| 20 | `#52afbb` | `oklch(70.21% 0.0894 206.18)` | Thalassa | black, 8.2 to 1 |
| 21 | `#64c0c9` | `oklch(75.54% 0.0883 203.21)` | Baharroth Blue | black, 9.9 to 1 |
| 22 | `#75d0d4` | `oklch(80.31% 0.0879 198.79)` | Soft Turquoise | black, 11.7 to 1 |
| 23 | `#81ddda` | `oklch(84.07% 0.0884 192.14)` | Cold Blue | black, 13.3 to 1 |
| 24 | `#8be6d7` | `oklch(86.33% 0.0902 182.47)` | Neverland | black, 14.3 to 1 |
| 25 | `#93e8c8` | `oklch(86.72% 0.0939 168.47)` | Bubble Algae | black, 14.5 to 1 |
| 26 | `#a0e2ac` | `oklch(85.39% 0.0996 149.36)` | Weekend Gardener | black, 13.9 to 1 |
| 27 | `#b4d487` | `oklch(82.82% 0.1067 126.80)` | Fresh Lettuce | black, 12.7 to 1 |
| 28 | `#cabf63` | `oklch(79.46% 0.1146 102.57)` | Go Go Lime | black, 11.1 to 1 |
| 29 | `#daa64d` | `oklch(75.77% 0.1226 78.42)` | Plantain Chips | black, 9.5 to 1 |
| 30 | `#e28e4e` | `oklch(72.21% 0.1300 56.13)` | Jasper Orange | black, 8.2 to 1 |
| 31 | `#e37b5c` | `oklch(69.24% 0.1362 37.45)` | Sari | black, 7.2 to 1 |
| 32 | `#df706b` | `oklch(67.32% 0.1406 24.15)` | Childhood Crush | black, 6.6 to 1 |

## CSS

```css
background: linear-gradient(135deg, #f3cd8b 0.0%, #d8c67e 3.2%, #adbc76 6.5%, #77ae7a 9.7%, #3b9a84 12.9%, #00828b 16.1%, #006a8a 19.4%, #1c5685 22.6%, #284a7f 25.8%, #2a467d 29.0%, #29487d 32.3%, #244d80 35.5%, #1c5684 38.7%, #106088 41.9%, #046b8b 45.2%, #05768f 48.4%, #148195 51.6%, #298e9f 54.8%, #3d9eac 58.1%, #52afbb 61.3%, #64c0c9 64.5%, #75d0d4 67.7%, #81ddda 71.0%, #8be6d7 74.2%, #93e8c8 77.4%, #a0e2ac 80.6%, #b4d487 83.9%, #cabf63 87.1%, #daa64d 90.3%, #e28e4e 93.5%, #e37b5c 96.8%, #df706b 100.0%);
background: linear-gradient(135deg in oklch, oklch(86.61% 0.0937 80.16) 0.0%, oklch(82.61% 0.0941 95.86) 3.2%, oklch(76.81% 0.0947 118.52) 6.5%, oklch(69.88% 0.0954 145.59) 9.7%, oklch(62.48% 0.0961 174.54) 12.9%, oklch(55.27% 0.0941 202.85) 16.1%, oklch(48.89% 0.0953 227.99) 19.4%, oklch(44.01% 0.0977 247.36) 22.6%, oklch(41.25% 0.0978 258.61) 25.8%, oklch(40.24% 0.0976 262.41) 29.0%, oklch(40.49% 0.0972 260.72) 32.3%, oklch(41.77% 0.0966 254.95) 35.5%, oklch(43.84% 0.0959 246.51) 38.7%, oklch(46.47% 0.0952 236.83) 41.9%, oklch(49.42% 0.0945 227.32) 45.2%, oklch(52.46% 0.0939 219.40) 48.4%, oklch(55.57% 0.0934 214.23) 51.6%, oklch(59.76% 0.0923 210.91) 54.8%, oklch(64.79% 0.0909 208.48) 58.1%, oklch(70.21% 0.0894 206.18) 61.3%, oklch(75.54% 0.0883 203.21) 64.5%, oklch(80.31% 0.0879 198.79) 67.7%, oklch(84.07% 0.0884 192.14) 71.0%, oklch(86.33% 0.0902 182.47) 74.2%, oklch(86.72% 0.0939 168.47) 77.4%, oklch(85.39% 0.0996 149.36) 80.6%, oklch(82.82% 0.1067 126.80) 83.9%, oklch(79.46% 0.1146 102.57) 87.1%, oklch(75.77% 0.1226 78.42) 90.3%, oklch(72.21% 0.1300 56.13) 93.5%, oklch(69.24% 0.1362 37.45) 96.8%, oklch(67.32% 0.1406 24.15) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.866 | 0.094 | 80.2 |
| 2 | 0.417 | 0.098 | 256.6 |
| 3 | 0.539 | 0.094 | 216.5 |
| 4 | 0.866 | 0.091 | 179.5 |
| 5 | 0.673 | 0.141 | 24.1 |

## In these collections

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

## Other forms

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