# Teal and stone coastal rockpool spring palette

The Teal and stone coastal rockpool spring palette brings together blue, teal, and light green. The colors span a moderate lightness range, combining moderate color with clear contrast. Its balanced and composed character suits seasonal campaigns and event graphics. Its darkest tone is blue, and its lightest tone is light green.

- Also called: Blue to gray linear gradient
- Seed: `kWaUCsyKK-12cvbqE7t6ZK5Q`
- Page: https://grabient.com/kWaUCsyKK-12cvbqE7t6ZK5Q?steps=32&angle=180
- Drawn as: linear gradient, 32 steps, 180 degrees
- Kinds: dark to light, pastel, cool
- Hues: wide
- Contrast of its darkest and lightest colors: 5.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 | `#145077` | `oklch(41.34% 0.0882 242.58)` | Silk Jewel | white, 8.6 to 1 |
| 2 | `#16547b` | `oklch(42.59% 0.0889 241.89)` | Ocean Spray | white, 8.1 to 1 |
| 3 | `#195980` | `oklch(44.26% 0.0901 241.03)` | Whale’s Tale | white, 7.5 to 1 |
| 4 | `#1c5f86` | `oklch(46.25% 0.0914 240.02)` | Sapphire Sparkle | white, 6.9 to 1 |
| 5 | `#21658d` | `oklch(48.46% 0.0928 238.86)` | Traditional Blue | white, 6.3 to 1 |
| 6 | `#256d95` | `oklch(50.80% 0.0941 237.53)` | Blue Oasis | white, 5.7 to 1 |
| 7 | `#2a749c` | `oklch(53.17% 0.0950 236.05)` | Bateau | white, 5.1 to 1 |
| 8 | `#2f7ba2` | `oklch(55.46% 0.0953 234.40)` | Prominent Blue | white, 4.6 to 1 |
| 9 | `#3482a8` | `oklch(57.61% 0.0949 232.61)` | Lake Henry | black, 4.9 to 1 |
| 10 | `#3a89ad` | `oklch(59.78% 0.0938 230.75)` | Underwater Moonlight | black, 5.3 to 1 |
| 11 | `#4191b2` | `oklch(62.03% 0.0922 228.81)` | Navagio Bay | black, 5.9 to 1 |
| 12 | `#4998b7` | `oklch(64.31% 0.0902 226.73)` | Coastline Blue | black, 6.4 to 1 |
| 13 | `#519fbc` | `oklch(66.56% 0.0879 224.46)` | Rushing Rapids | black, 7 to 1 |
| 14 | `#59a7c0` | `oklch(68.76% 0.0853 221.92)` | Pottery Blue | black, 7.6 to 1 |
| 15 | `#61adc4` | `oklch(70.83% 0.0826 219.07)` | Blue Mist | black, 8.3 to 1 |
| 16 | `#68b4c7` | `oklch(72.74% 0.0799 215.83)` | Riverside Blue | black, 8.9 to 1 |
| 17 | `#6fbac9` | `oklch(74.47% 0.0771 212.16)` | Delusional Dragonfly | black, 9.5 to 1 |
| 18 | `#77bfca` | `oklch(76.10% 0.0739 208.15)` | Meltwater | black, 10 to 1 |
| 19 | `#7fc4cb` | `oklch(77.65% 0.0704 203.81)` | Wavelet | black, 10.6 to 1 |
| 20 | `#87c8cb` | `oklch(79.09% 0.0667 199.16)` | Embellished Blue | black, 11.1 to 1 |
| 21 | `#8fcccb` | `oklch(80.40% 0.0630 194.20)` | Lake | black, 11.6 to 1 |
| 22 | `#96d0ca` | `oklch(81.56% 0.0596 188.93)` | Clear Cove | black, 12.1 to 1 |
| 23 | `#9dd2c9` | `oklch(82.53% 0.0566 183.37)` | Refresh | black, 12.5 to 1 |
| 24 | `#a3d4c8` | `oklch(83.31% 0.0542 177.51)` | Refresh | black, 12.8 to 1 |
| 25 | `#a8d6c5` | `oklch(83.83% 0.0526 171.05)` | Southern Belle | black, 13 to 1 |
| 26 | `#add6c1` | `oklch(84.06% 0.0516 163.47)` | Ginninderra | black, 13.1 to 1 |
| 27 | `#b1d5bd` | `oklch(84.06% 0.0510 155.18)` | Frosted Fir | black, 13.1 to 1 |
| 28 | `#b5d4b7` | `oklch(83.91% 0.0508 146.68)` | Enchanted Meadow | black, 13 to 1 |
| 29 | `#b9d2b2` | `oklch(83.66% 0.0508 138.43)` | Lime Taffy | black, 12.9 to 1 |
| 30 | `#bdd0ae` | `oklch(83.40% 0.0510 130.91)` | Gamin | black, 12.7 to 1 |
| 31 | `#c0ceaa` | `oklch(83.18% 0.0510 124.61)` | Landscape | black, 12.6 to 1 |
| 32 | `#c3cda8` | `oklch(83.07% 0.0510 119.99)` | Baize Green | black, 12.6 to 1 |

## CSS

```css
background: linear-gradient(180deg, #145077 0.0%, #16547b 3.2%, #195980 6.5%, #1c5f86 9.7%, #21658d 12.9%, #256d95 16.1%, #2a749c 19.4%, #2f7ba2 22.6%, #3482a8 25.8%, #3a89ad 29.0%, #4191b2 32.3%, #4998b7 35.5%, #519fbc 38.7%, #59a7c0 41.9%, #61adc4 45.2%, #68b4c7 48.4%, #6fbac9 51.6%, #77bfca 54.8%, #7fc4cb 58.1%, #87c8cb 61.3%, #8fcccb 64.5%, #96d0ca 67.7%, #9dd2c9 71.0%, #a3d4c8 74.2%, #a8d6c5 77.4%, #add6c1 80.6%, #b1d5bd 83.9%, #b5d4b7 87.1%, #b9d2b2 90.3%, #bdd0ae 93.5%, #c0ceaa 96.8%, #c3cda8 100.0%);
background: linear-gradient(180deg in oklch, oklch(41.34% 0.0882 242.58) 0.0%, oklch(42.59% 0.0889 241.89) 3.2%, oklch(44.26% 0.0901 241.03) 6.5%, oklch(46.25% 0.0914 240.02) 9.7%, oklch(48.46% 0.0928 238.86) 12.9%, oklch(50.80% 0.0941 237.53) 16.1%, oklch(53.17% 0.0950 236.05) 19.4%, oklch(55.46% 0.0953 234.40) 22.6%, oklch(57.61% 0.0949 232.61) 25.8%, oklch(59.78% 0.0938 230.75) 29.0%, oklch(62.03% 0.0922 228.81) 32.3%, oklch(64.31% 0.0902 226.73) 35.5%, oklch(66.56% 0.0879 224.46) 38.7%, oklch(68.76% 0.0853 221.92) 41.9%, oklch(70.83% 0.0826 219.07) 45.2%, oklch(72.74% 0.0799 215.83) 48.4%, oklch(74.47% 0.0771 212.16) 51.6%, oklch(76.10% 0.0739 208.15) 54.8%, oklch(77.65% 0.0704 203.81) 58.1%, oklch(79.09% 0.0667 199.16) 61.3%, oklch(80.40% 0.0630 194.20) 64.5%, oklch(81.56% 0.0596 188.93) 67.7%, oklch(82.53% 0.0566 183.37) 71.0%, oklch(83.31% 0.0542 177.51) 74.2%, oklch(83.83% 0.0526 171.05) 77.4%, oklch(84.06% 0.0516 163.47) 80.6%, oklch(84.06% 0.0510 155.18) 83.9%, oklch(83.91% 0.0508 146.68) 87.1%, oklch(83.66% 0.0508 138.43) 90.3%, oklch(83.40% 0.0510 130.91) 93.5%, oklch(83.18% 0.0510 124.61) 96.8%, oklch(83.07% 0.0510 119.99) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.413 | 0.088 | 242.6 |
| 2 | 0.571 | 0.095 | 233.1 |
| 3 | 0.736 | 0.079 | 214 |
| 4 | 0.835 | 0.054 | 176 |
| 5 | 0.831 | 0.051 | 120 |

## In these collections

- [Coastal rockpool spring](https://grabient.com/coastal-rockpool-spring)

## Other forms

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