# Blue and ochre tropical palette

The Blue and ochre tropical palette brings together dark blue, blue, light red, and gold. The colors span a broad lightness range, combining moderate color with clear contrast. Its balanced and composed character suits travel posters and environmental mood boards. Its darkest tone is dark blue, and its lightest tone is gold.

- Also called: Navy, blue, pink and tan angular swatches
- Seed: `kWRSi6N6LAc4hQBboMq6anKo`
- Page: https://grabient.com/kWRSi6N6LAc4hQBboMq6anKo?style=angularSwatches&steps=5&angle=135
- Drawn as: angular swatches, 5 steps, 135 degrees
- Kinds: dark to light, muted
- Hues: multi-hue
- Contrast of its darkest and lightest colors: 8.9 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 | `#172642` | `oklch(27.17% 0.0551 261.56)` | Eternal Darkness | white, 15 to 1 |
| 2 | `#394f86` | `oklch(43.70% 0.0951 265.79)` | Tory Blue | white, 7.9 to 1 |
| 3 | `#6c83bc` | `oklch(61.42% 0.0909 266.85)` | Orbital | black, 5.5 to 1 |
| 4 | `#d38da5` | `oklch(72.05% 0.0896 357.73)` | Kiss | black, 8.1 to 1 |
| 5 | `#e6c46c` | `oklch(83.07% 0.1144 88.61)` | Bountiful Gold | black, 12.4 to 1 |

## CSS

```css
background: conic-gradient(from 135deg, #172642 0.000% 20.000%, #394f86 20.000% 40.000%, #6c83bc 40.000% 60.000%, #d38da5 60.000% 80.000%, #e6c46c 80.000% 100.000%);
background: conic-gradient(from 135deg, oklch(27.17% 0.0551 261.56) 0.000% 20.000%, oklch(43.70% 0.0951 265.79) 20.000% 40.000%, oklch(61.42% 0.0909 266.85) 40.000% 60.000%, oklch(72.05% 0.0896 357.73) 60.000% 80.000%, oklch(83.07% 0.1144 88.61) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.272 | 0.055 | 261.6 |
| 2 | 0.437 | 0.095 | 265.8 |
| 3 | 0.614 | 0.091 | 266.8 |
| 4 | 0.72 | 0.09 | 357.7 |
| 5 | 0.831 | 0.114 | 448.6 |

## In these collections

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

## Other forms

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