# Sunlit Lagoon Depths

Navy, light green, tan and gray radial gradient with 32 colors: #00004a, #001744, #002651, #003861, #004c74, #0b6386, #2b7994, #468fa1, #5fa3ad, #76b5b7, #88c3be, #96cdc1, #a0d5c1, #aadabc, #b5dcb4, #c0dca9, #ccda9e, #d7d694, #e2d28d, #eacf89, #f0cd89, #f3ce8c, #f3d091, #efd398, #ead79f, #e4dba9, #dedeb3, #d9e0bd, #d6e1c6, #d5e2ce, #d6e2d3, #d7e2d7. Edit it and copy or download CSS, SVG, PNG or shader code.

- Also called: Navy, light green, tan and gray radial gradient
- Seed: `kUL128ZBY2u4iM5yh0dA`
- Page: https://grabient.com/kUL128ZBY2u4iM5yh0dA?style=radialGradient&steps=32&angle=0
- Drawn as: radial gradient, 32 steps, 0 degrees
- Kinds: dark to light, pastel, light
- Hues: two-hue
- Contrast of its darkest and lightest colors: 14.3 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 | `#00004a` | `oklch(18.53% 0.1280 264.38)` | Endless Galaxy | white, 19.1 to 1 |
| 2 | `#001744` | `oklch(22.20% 0.0917 260.24)` | Cetacean Blue | white, 17.4 to 1 |
| 3 | `#002651` | `oklch(27.17% 0.0886 254.70)` | Subnautical | white, 15 to 1 |
| 4 | `#003861` | `oklch(33.16% 0.0898 248.26)` | Marine Blue | white, 12.1 to 1 |
| 5 | `#004c74` | `oklch(39.85% 0.0930 241.05)` | Blue Meridian | white, 9.1 to 1 |
| 6 | `#0b6386` | `oklch(46.93% 0.0938 233.17)` | Blue Heist | white, 6.7 to 1 |
| 7 | `#2b7994` | `oklch(54.11% 0.0853 224.83)` | Turkish Stone | white, 4.9 to 1 |
| 8 | `#468fa1` | `oklch(61.06% 0.0773 216.11)` | Winter Time | black, 5.7 to 1 |
| 9 | `#5fa3ad` | `oklch(67.49% 0.0704 207.16)` | Aqua Sea | black, 7.3 to 1 |
| 10 | `#76b5b7` | `oklch(73.09% 0.0649 198.13)` | Kingfisher Turquoise | black, 9 to 1 |
| 11 | `#88c3be` | `oklch(77.56% 0.0613 189.14)` | Undine | black, 10.6 to 1 |
| 12 | `#96cdc1` | `oklch(80.73% 0.0601 179.85)` | Jamaica Bay | black, 11.8 to 1 |
| 13 | `#a0d5c1` | `oklch(83.03% 0.0614 168.98)` | Flowering Cactus | black, 12.7 to 1 |
| 14 | `#aadabc` | `oklch(84.60% 0.0647 156.93)` | Shanghai Jade | black, 13.4 to 1 |
| 15 | `#b5dcb4` | `oklch(85.58% 0.0693 144.22)` | A Mann’s Mint | black, 13.8 to 1 |
| 16 | `#c0dca9` | `oklch(86.09% 0.0747 131.39)` | Bowling Green | black, 14 to 1 |
| 17 | `#ccda9e` | `oklch(86.28% 0.0804 118.94)` | Frisky | black, 14 to 1 |
| 18 | `#d7d694` | `oklch(86.27% 0.0858 107.42)` | Mellow Green | black, 13.9 to 1 |
| 19 | `#e2d28d` | `oklch(86.18% 0.0903 97.35)` | Leaf Print | black, 13.8 to 1 |
| 20 | `#eacf89` | `oklch(86.16% 0.0934 89.25)` | Sundress | black, 13.7 to 1 |
| 21 | `#f0cd89` | `oklch(86.33% 0.0944 83.64)` | Spaghetti Monster | black, 13.8 to 1 |
| 22 | `#f3ce8c` | `oklch(86.80% 0.0929 81.08)` | Warm Glow | black, 13.9 to 1 |
| 23 | `#f3d091` | `oklch(87.31% 0.0888 81.88)` | Maple Elixir | black, 14.2 to 1 |
| 24 | `#efd398` | `oklch(87.78% 0.0827 85.57)` | White Corn | black, 14.4 to 1 |
| 25 | `#ead79f` | `oklch(88.20% 0.0750 91.51)` | Leaf Yellow | black, 14.7 to 1 |
| 26 | `#e4dba9` | `oklch(88.59% 0.0663 99.08)` | Virgin Olive Oil | black, 14.9 to 1 |
| 27 | `#dedeb3` | `oklch(88.93% 0.0570 107.67)` | Modern Zen | black, 15.1 to 1 |
| 28 | `#d9e0bd` | `oklch(89.24% 0.0476 116.64)` | Mountain Spring | black, 15.3 to 1 |
| 29 | `#d6e1c6` | `oklch(89.52% 0.0387 125.37)` | Security | black, 15.4 to 1 |
| 30 | `#d5e2ce` | `oklch(89.76% 0.0306 133.24)` | Sweet Mint Tea | black, 15.6 to 1 |
| 31 | `#d6e2d3` | `oklch(89.97% 0.0240 139.63)` | Green Mirror | black, 15.6 to 1 |
| 32 | `#d7e2d7` | `oklch(90.16% 0.0193 143.91)` | Fleeting Green | black, 15.7 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #00004a 0.0%, #001744 3.2%, #002651 6.5%, #003861 9.7%, #004c74 12.9%, #0b6386 16.1%, #2b7994 19.4%, #468fa1 22.6%, #5fa3ad 25.8%, #76b5b7 29.0%, #88c3be 32.3%, #96cdc1 35.5%, #a0d5c1 38.7%, #aadabc 41.9%, #b5dcb4 45.2%, #c0dca9 48.4%, #ccda9e 51.6%, #d7d694 54.8%, #e2d28d 58.1%, #eacf89 61.3%, #f0cd89 64.5%, #f3ce8c 67.7%, #f3d091 71.0%, #efd398 74.2%, #ead79f 77.4%, #e4dba9 80.6%, #dedeb3 83.9%, #d9e0bd 87.1%, #d6e1c6 90.3%, #d5e2ce 93.5%, #d6e2d3 96.8%, #d7e2d7 100.0%);
background: radial-gradient(circle at 50% 50% in oklch, oklch(18.53% 0.1280 264.38) 0.0%, oklch(22.20% 0.0917 260.24) 3.2%, oklch(27.17% 0.0886 254.70) 6.5%, oklch(33.16% 0.0898 248.26) 9.7%, oklch(39.85% 0.0930 241.05) 12.9%, oklch(46.93% 0.0938 233.17) 16.1%, oklch(54.11% 0.0853 224.83) 19.4%, oklch(61.06% 0.0773 216.11) 22.6%, oklch(67.49% 0.0704 207.16) 25.8%, oklch(73.09% 0.0649 198.13) 29.0%, oklch(77.56% 0.0613 189.14) 32.3%, oklch(80.73% 0.0601 179.85) 35.5%, oklch(83.03% 0.0614 168.98) 38.7%, oklch(84.60% 0.0647 156.93) 41.9%, oklch(85.58% 0.0693 144.22) 45.2%, oklch(86.09% 0.0747 131.39) 48.4%, oklch(86.28% 0.0804 118.94) 51.6%, oklch(86.27% 0.0858 107.42) 54.8%, oklch(86.18% 0.0903 97.35) 58.1%, oklch(86.16% 0.0934 89.25) 61.3%, oklch(86.33% 0.0944 83.64) 64.5%, oklch(86.80% 0.0929 81.08) 67.7%, oklch(87.31% 0.0888 81.88) 71.0%, oklch(87.78% 0.0827 85.57) 74.2%, oklch(88.20% 0.0750 91.51) 77.4%, oklch(88.59% 0.0663 99.08) 80.6%, oklch(88.93% 0.0570 107.67) 83.9%, oklch(89.24% 0.0476 116.64) 87.1%, oklch(89.52% 0.0387 125.37) 90.3%, oklch(89.76% 0.0306 133.24) 93.5%, oklch(89.97% 0.0240 139.63) 96.8%, oklch(90.16% 0.0193 143.91) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.185 | 0.128 | 264.4 |
| 2 | 0.787 | 0.061 | 186.2 |
| 3 | 0.866 | 0.094 | 81.6 |
| 4 | 0.902 | 0.019 | 143.9 |

## In these collections

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

## Other forms

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