# Ochre navy and gold palette

The Ochre navy and gold palette brings together dark blue, blue, orange, gold, and light orange. The colors span a broad lightness range, combining moderate color with clear contrast. Its balanced and composed character suits brand mood boards and editorial graphics. Its darkest tone is dark blue, and its lightest tone is light orange.

- Also called: Navy, brown and tan angular swatches
- Seed: `kYRDS9Nwu6s0fMHjK8BcZa_larv8`
- Page: https://grabient.com/kYRDS9Nwu6s0fMHjK8BcZa_larv8?style=angularSwatches&steps=6&angle=135
- Drawn as: angular swatches, 6 steps, 135 degrees
- Kinds: light center
- Hues: complementary
- Contrast of its darkest and lightest colors: 11.1 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 | `#152348` | `oklch(26.77% 0.0717 265.78)` | Dark Eclipse | white, 15.3 to 1 |
| 2 | `#3d555d` | `oklch(43.31% 0.0317 221.40)` | Casal | white, 7.9 to 1 |
| 3 | `#968042` | `oklch(60.63% 0.0854 90.36)` | Yellow Nile | black, 5.4 to 1 |
| 4 | `#d1b555` | `oklch(77.95% 0.1199 93.53)` | Warm Woollen | black, 10.4 to 1 |
| 5 | `#ecdbae` | `oklch(89.37% 0.0620 90.36)` | Shortcake | black, 15.2 to 1 |
| 6 | `#b69433` | `oklch(68.11% 0.1199 89.30)` | Balsam Pear | black, 7.2 to 1 |

## CSS

```css
background: conic-gradient(from 135deg, #152348 0.000% 16.667%, #3d555d 16.667% 33.333%, #968042 33.333% 50.000%, #d1b555 50.000% 66.667%, #ecdbae 66.667% 83.333%, #b69433 83.333% 100.000%);
background: conic-gradient(from 135deg, oklch(26.77% 0.0717 265.78) 0.000% 16.667%, oklch(43.31% 0.0317 221.40) 16.667% 33.333%, oklch(60.63% 0.0854 90.36) 33.333% 50.000%, oklch(77.95% 0.1199 93.53) 50.000% 66.667%, oklch(89.37% 0.0620 90.36) 66.667% 83.333%, oklch(68.11% 0.1199 89.30) 83.333% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.268 | 0.072 | 265.8 |
| 2 | 0.433 | 0.032 | 221.4 |
| 3 | 0.606 | 0.085 | 90.4 |
| 4 | 0.78 | 0.12 | 93.5 |
| 5 | 0.894 | 0.062 | 90.4 |
| 6 | 0.681 | 0.12 | 89.3 |

## In these collections

- [Navy and gold](https://grabient.com/navy-and-gold)

## Other forms

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