# Gold and navy color palette

The Gold and navy color palette brings together light yellow, orange, blue, dark blue, and gold. 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 yellow.

- Also called: Tan and navy linear swatches
- Seed: `kY4VhJ2aE-a4QUckHkHvAy8mGjLm`
- Page: https://grabient.com/kY4VhJ2aE-a4QUckHkHvAy8mGjLm?style=linearSwatches&steps=6
- Drawn as: linear swatches, 6 steps, 90 degrees
- Kinds: dark center
- Hues: complementary
- Contrast of its darkest and lightest colors: 10.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 | `#e7dd7a` | `oklch(88.58% 0.1213 103.36)` | Lustrous Yellow | black, 15 to 1 |
| 2 | `#b59e5b` | `oklch(70.47% 0.0909 90.68)` | Antique Gold | black, 8 to 1 |
| 3 | `#284153` | `oklch(36.22% 0.0441 241.79)` | Reef Resort | white, 10.6 to 1 |
| 4 | `#0d2852` | `oklch(28.35% 0.0827 258.70)` | Dark Tyrian Blue | white, 14.5 to 1 |
| 5 | `#485f6b` | `oklch(47.24% 0.0344 230.17)` | Ragtime Blues | white, 6.6 to 1 |
| 6 | `#d2ae6a` | `oklch(76.77% 0.0965 82.22)` | New Wheat | black, 9.9 to 1 |

## CSS

```css
background: linear-gradient(90deg, #e7dd7a 0.000% 16.667%, #b59e5b 16.667% 33.333%, #284153 33.333% 50.000%, #0d2852 50.000% 66.667%, #485f6b 66.667% 83.333%, #d2ae6a 83.333% 100.000%);
background: linear-gradient(90deg, oklch(88.58% 0.1213 103.36) 0.000% 16.667%, oklch(70.47% 0.0909 90.68) 16.667% 33.333%, oklch(36.22% 0.0441 241.79) 33.333% 50.000%, oklch(28.35% 0.0827 258.70) 50.000% 66.667%, oklch(47.24% 0.0344 230.17) 66.667% 83.333%, oklch(76.77% 0.0965 82.22) 83.333% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.886 | 0.121 | 103.4 |
| 2 | 0.705 | 0.091 | 90.7 |
| 3 | 0.362 | 0.044 | 241.8 |
| 4 | 0.283 | 0.083 | 258.7 |
| 5 | 0.472 | 0.034 | 230.2 |
| 6 | 0.768 | 0.096 | 82.2 |

## In these collections

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

## Other forms

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