# Cobalt blue, violet and emerald navratri palette

The Cobalt blue, violet and emerald navratri palette brings together blue, red, purple, gold, and green. The colors span a moderate lightness range, combining strong color with clear contrast. Its bold and dramatic character suits brand mood boards and editorial graphics. Its darkest tone is purple, and its lightest tone is gold.

- Also called: Blue, purple, yellow and green angular swatches
- Seed: `kWalG407fLjQvOpqu1Bxa1GQ`
- Page: https://grabient.com/kWalG407fLjQvOpqu1Bxa1GQ?style=angularSwatches&steps=5&angle=225
- Drawn as: angular swatches, 5 steps, 225 degrees
- Hues: complementary
- Contrast of its darkest and lightest colors: 5.7 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 | `#244b88` | `oklch(41.73% 0.1116 259.45)` | Olympian Blue | white, 8.6 to 1 |
| 2 | `#d96491` | `oklch(65.75% 0.1530 357.73)` | Groovy | black, 6.1 to 1 |
| 3 | `#61307c` | `oklch(40.94% 0.1295 312.29)` | Deep Amethyst | white, 9.4 to 1 |
| 4 | `#f0c529` | `oklch(83.86% 0.1626 91.78)` | Moon Yellow | black, 12.7 to 1 |
| 5 | `#398341` | `oklch(54.72% 0.1240 145.68)` | Vine | white, 4.6 to 1 |

## CSS

```css
background: conic-gradient(from 225deg, #244b88 0.000% 20.000%, #d96491 20.000% 40.000%, #61307c 40.000% 60.000%, #f0c529 60.000% 80.000%, #398341 80.000% 100.000%);
background: conic-gradient(from 225deg, oklch(41.73% 0.1116 259.45) 0.000% 20.000%, oklch(65.75% 0.1530 357.73) 20.000% 40.000%, oklch(40.94% 0.1295 312.29) 40.000% 60.000%, oklch(83.86% 0.1626 91.78) 60.000% 80.000%, oklch(54.72% 0.1240 145.68) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.417 | 0.112 | 259.5 |
| 2 | 0.657 | 0.153 | 357.7 |
| 3 | 0.409 | 0.13 | 312.3 |
| 4 | 0.839 | 0.163 | 451.8 |
| 5 | 0.547 | 0.124 | 505.7 |

## In these collections

- [Navratri swatches](https://grabient.com/navratri-swatches)

## Other forms

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