# Navy, silver and tan indigo yukata palette

The Navy, silver and tan indigo yukata palette brings together blue, gray, light orange, and orange. The colors span a moderate lightness range, combining restrained color with clear contrast. Its balanced and composed character suits brand mood boards and editorial graphics. Its darkest tone is blue, and its lightest tone is light orange.

- Also called: Complementary navy, tan and gray linear swatches
- Seed: `kYVym-vpM-VUBvTiCq13xO_c2Rv2`
- Page: https://grabient.com/kYVym-vpM-VUBvTiCq13xO_c2Rv2?style=linearSwatches&steps=6
- Drawn as: linear swatches, 6 steps, 90 degrees
- Kinds: light center, muted
- Hues: complementary
- Contrast of its darkest and lightest colors: 5.6 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 | `#2c3756` | `oklch(34.25% 0.0565 267.89)` | Mediaeval Blue | white, 11.7 to 1 |
| 2 | `#4c637f` | `oklch(49.21% 0.0524 254.15)` | Admiral Blue | white, 6.1 to 1 |
| 3 | `#939597` | `oklch(66.93% 0.0041 230.90)` | Fighter Jet | black, 7 to 1 |
| 4 | `#c0b2a1` | `oklch(77.17% 0.0289 74.51)` | Balanced Beige | black, 10.1 to 1 |
| 5 | `#c4a889` | `oklch(74.80% 0.0537 70.28)` | Cork Wedge | black, 9.3 to 1 |
| 6 | `#987e65` | `oklch(61.02% 0.0482 66.05)` | Rookwood Clay | black, 5.4 to 1 |

## CSS

```css
background: linear-gradient(90deg, #2c3756 0.000% 16.667%, #4c637f 16.667% 33.333%, #939597 33.333% 50.000%, #c0b2a1 50.000% 66.667%, #c4a889 66.667% 83.333%, #987e65 83.333% 100.000%);
background: linear-gradient(90deg, oklch(34.25% 0.0565 267.89) 0.000% 16.667%, oklch(49.21% 0.0524 254.15) 16.667% 33.333%, oklch(66.93% 0.0041 230.90) 33.333% 50.000%, oklch(77.17% 0.0289 74.51) 50.000% 66.667%, oklch(74.80% 0.0537 70.28) 66.667% 83.333%, oklch(61.02% 0.0482 66.05) 83.333% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.343 | 0.056 | 267.9 |
| 2 | 0.492 | 0.052 | 254.2 |
| 3 | 0.669 | 0.004 | 230.9 |
| 4 | 0.772 | 0.029 | 74.5 |
| 5 | 0.748 | 0.054 | 70.3 |
| 6 | 0.61 | 0.048 | 66.1 |

## In these collections

- [Indigo yukata](https://grabient.com/indigo-yukata)

## Other forms

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