# Navy, bronze and lime coastal rockpool spring

The Navy, bronze and lime coastal rockpool spring brings together blue, magenta, orange, gold, and green. The colors span a broad lightness range, combining moderate color with clear contrast. Its balanced and composed character suits seasonal campaigns and event graphics. Its darkest tone is magenta, and its lightest tone is green.

- Also called: Blue, dark purple, brown and green linear swatches
- Seed: `kYZjatrBLMTorxlNssG3jBD-c1RA`
- Page: https://grabient.com/kYZjatrBLMTorxlNssG3jBD-c1RA?style=linearSwatches&steps=6&angle=135
- Drawn as: linear swatches, 6 steps, 135 degrees
- Kinds: vivid, multicolor
- Hues: wide
- Contrast of its darkest and lightest colors: 6.7 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 | `#204c6d` | `oklch(40.16% 0.0744 243.98)` | Indigo Cloth | white, 9 to 1 |
| 2 | `#4d2e3e` | `oklch(34.65% 0.0510 348.60)` | Japanese Wineberry | white, 11.7 to 1 |
| 3 | `#8c3b16` | `oklch(45.67% 0.1199 42.50)` | Dusky Orange | white, 7.6 to 1 |
| 4 | `#c06a17` | `oklch(61.02% 0.1392 57.29)` | Thai Curry | black, 5.3 to 1 |
| 5 | `#caa737` | `oklch(74.02% 0.1323 91.11)` | Aru Ressha | black, 9 to 1 |
| 6 | `#aad263` | `oklch(81.10% 0.1461 125.98)` | Lime Lizard | black, 12 to 1 |

## CSS

```css
background: linear-gradient(135deg, #204c6d 0.000% 16.667%, #4d2e3e 16.667% 33.333%, #8c3b16 33.333% 50.000%, #c06a17 50.000% 66.667%, #caa737 66.667% 83.333%, #aad263 83.333% 100.000%);
background: linear-gradient(135deg, oklch(40.16% 0.0744 243.98) 0.000% 16.667%, oklch(34.65% 0.0510 348.60) 16.667% 33.333%, oklch(45.67% 0.1199 42.50) 33.333% 50.000%, oklch(61.02% 0.1392 57.29) 50.000% 66.667%, oklch(74.02% 0.1323 91.11) 66.667% 83.333%, oklch(81.10% 0.1461 125.98) 83.333% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.402 | 0.074 | 244 |
| 2 | 0.346 | 0.051 | 348.6 |
| 3 | 0.457 | 0.12 | 402.5 |
| 4 | 0.61 | 0.139 | 417.3 |
| 5 | 0.74 | 0.132 | 451.1 |
| 6 | 0.811 | 0.146 | 486 |

## In these collections

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

## Other forms

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