# Wine and blue navy palette

The Wine and blue navy palette brings together red, dark purple, dark blue, and blue. The colors span a narrow lightness range, combining restrained color with gentle contrast. Its dark and grounded character suits brand mood boards and editorial graphics. Its darkest tone is dark blue, and its lightest tone is blue.

- Also called: Maroon, black, blue and navy angular swatches
- Seed: `kYUzf9ng-6B8Uuywmr6ppjAJaQQO`
- Page: https://grabient.com/kYUzf9ng-6B8Uuywmr6ppjAJaQQO?style=angularSwatches&steps=6&angle=315
- Drawn as: angular swatches, 6 steps, 315 degrees
- Kinds: dark, cool
- Hues: analogous
- Contrast of its darkest and lightest colors: 1.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 | `#522235` | `oklch(32.68% 0.0758 356.48)` | Carambar | white, 12.8 to 1 |
| 2 | `#24192e` | `oklch(23.62% 0.0427 306.82)` | Black Howl | white, 16.8 to 1 |
| 3 | `#141f3b` | `oklch(24.41% 0.0565 266.66)` | Nightwalker | white, 16.3 to 1 |
| 4 | `#284469` | `oklch(38.19% 0.0730 256.09)` | Nightlife | white, 9.9 to 1 |
| 5 | `#182e50` | `oklch(30.31% 0.0675 258.21)` | Elite Blue | white, 13.5 to 1 |
| 6 | `#081024` | `oklch(17.72% 0.0441 266.66)` | Void | white, 18.9 to 1 |

## CSS

```css
background: conic-gradient(from 315deg, #522235 0.000% 16.667%, #24192e 16.667% 33.333%, #141f3b 33.333% 50.000%, #284469 50.000% 66.667%, #182e50 66.667% 83.333%, #081024 83.333% 100.000%);
background: conic-gradient(from 315deg, oklch(32.68% 0.0758 356.48) 0.000% 16.667%, oklch(23.62% 0.0427 306.82) 16.667% 33.333%, oklch(24.41% 0.0565 266.66) 33.333% 50.000%, oklch(38.19% 0.0730 256.09) 50.000% 66.667%, oklch(30.31% 0.0675 258.21) 66.667% 83.333%, oklch(17.72% 0.0441 266.66) 83.333% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.327 | 0.076 | 356.5 |
| 2 | 0.236 | 0.043 | 306.8 |
| 3 | 0.244 | 0.056 | 266.7 |
| 4 | 0.382 | 0.073 | 256.1 |
| 5 | 0.303 | 0.068 | 258.2 |
| 6 | 0.177 | 0.044 | 266.7 |

## In these collections

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

## Other forms

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