# Emerald, cobalt blue and ochre color palette

The Emerald, cobalt blue and ochre color palette brings together green, teal, blue, orange, and gold. The colors span a moderate lightness range, combining moderate color with clear contrast. Its balanced and composed character suits travel posters and environmental mood boards. Its darkest tone is blue, and its lightest tone is gold.

- Also called: Rainbow from green to yellow linear swatches
- Seed: `kWvUlryqVG7euRhXuNMZrdCw`
- Page: https://grabient.com/kWvUlryqVG7euRhXuNMZrdCw?style=linearSwatches&steps=5
- Drawn as: linear swatches, 5 steps, 90 degrees
- Kinds: dark center, vivid, rainbow
- Hues: split-complementary
- Contrast of its darkest and lightest colors: 4.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 | `#7bbe8c` | `oklch(74.41% 0.1006 151.17)` | Flashman | black, 9.6 to 1 |
| 2 | `#008c9e` | `oklch(58.66% 0.1016 210.36)` | Parrot Flight | black, 5.2 to 1 |
| 3 | `#294e96` | `oklch(43.70% 0.1268 262.13)` | Le Grand Bleu | white, 8 to 1 |
| 4 | `#dc8202` | `oklch(68.90% 0.1557 63.81)` | Tangerine Haze | black, 7.2 to 1 |
| 5 | `#e8b931` | `oklch(80.71% 0.1516 88.12)` | Last Sunlight | black, 11.4 to 1 |

## CSS

```css
background: linear-gradient(90deg, #7bbe8c 0.000% 20.000%, #008c9e 20.000% 40.000%, #294e96 40.000% 60.000%, #dc8202 60.000% 80.000%, #e8b931 80.000% 100.000%);
background: linear-gradient(90deg, oklch(74.41% 0.1006 151.17) 0.000% 20.000%, oklch(58.66% 0.1016 210.36) 20.000% 40.000%, oklch(43.70% 0.1268 262.13) 40.000% 60.000%, oklch(68.90% 0.1557 63.81) 60.000% 80.000%, oklch(80.71% 0.1516 88.12) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.744 | 0.101 | 151.2 |
| 2 | 0.587 | 0.102 | 210.3 |
| 3 | 0.437 | 0.127 | 262.1 |
| 4 | 0.689 | 0.156 | 423.8 |
| 5 | 0.807 | 0.152 | 448.1 |

## In these collections

- [Tropical swatches](https://grabient.com/tropical-swatches)
- [Summer swatches](https://grabient.com/summer-swatches)

## Other forms

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