# Cobalt blue and bronze coastal rockpool spring

The Cobalt blue and bronze coastal rockpool spring brings together blue, teal, light green, yellow, and orange. The colors span a moderate lightness range, combining moderate color with gentle 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, teal, green and brown linear swatches
- Seed: `kWd0et1aC6eQguhaHjqvxe74`
- Page: https://grabient.com/kWd0et1aC6eQguhaHjqvxe74?style=linearSwatches&steps=6&angle=180
- Drawn as: linear swatches, 6 steps, 180 degrees
- Kinds: light center, multicolor
- Hues: wide
- Contrast of its darkest and lightest colors: 3.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 | `#1f5f8d` | `oklch(46.85% 0.0978 243.98)` | Pontoon | white, 6.8 to 1 |
| 2 | `#389aa7` | `oklch(63.48% 0.0908 207.73)` | Rainy Mood | black, 6.3 to 1 |
| 3 | `#75c4a6` | `oklch(76.00% 0.0897 167.46)` | Gem Silica | black, 10.1 to 1 |
| 4 | `#a5c285` | `oklch(77.62% 0.0878 129.18)` | Green Herb | black, 10.6 to 1 |
| 5 | `#a4965b` | `oklch(67.13% 0.0795 95.46)` | Faded Khaki | black, 7 to 1 |
| 6 | `#7a5b38` | `oklch(49.61% 0.0648 69.62)` | Nut Oil | white, 6.1 to 1 |

## CSS

```css
background: linear-gradient(180deg, #1f5f8d 0.000% 16.667%, #389aa7 16.667% 33.333%, #75c4a6 33.333% 50.000%, #a5c285 50.000% 66.667%, #a4965b 66.667% 83.333%, #7a5b38 83.333% 100.000%);
background: linear-gradient(180deg, oklch(46.85% 0.0978 243.98) 0.000% 16.667%, oklch(63.48% 0.0908 207.73) 16.667% 33.333%, oklch(76.00% 0.0897 167.46) 33.333% 50.000%, oklch(77.62% 0.0878 129.18) 50.000% 66.667%, oklch(67.13% 0.0795 95.46) 66.667% 83.333%, oklch(49.61% 0.0648 69.62) 83.333% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.469 | 0.098 | 244 |
| 2 | 0.673 | 0.09 | 197.5 |
| 3 | 0.787 | 0.09 | 147.8 |
| 4 | 0.709 | 0.083 | 103.4 |
| 5 | 0.496 | 0.065 | 69.6 |

## In these collections

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

## Other forms

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