# Rose pink and blue palette

The Rose pink and blue palette brings together dark blue, blue, and magenta. 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 dark blue, and its lightest tone is magenta.

- Also called: Navy, blue, purple and pink angular swatches
- Seed: `kWPj-6rqk_cArPy9vUt1UtAw`
- Page: https://grabient.com/kWPj-6rqk_cArPy9vUt1UtAw?style=angularSwatches&steps=5&angle=225
- Drawn as: angular swatches, 5 steps, 225 degrees
- Kinds: dark to light, vivid
- Hues: two-hue
- Contrast of its darkest and lightest colors: 4.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 | `#071d49` | `oklch(24.41% 0.0868 262.27)` | Oxford Blue | white, 16.4 to 1 |
| 2 | `#123d79` | `oklch(36.61% 0.1130 258.04)` | Azure Dragon | white, 10.7 to 1 |
| 3 | `#2967a5` | `oklch(50.39% 0.1185 251.70)` | Distant Blue | white, 5.8 to 1 |
| 4 | `#9e276e` | `oklch(48.43% 0.1681 348.92)` | Amaranth Deep Purple | white, 7 to 1 |
| 5 | `#f04f98` | `oklch(66.93% 0.2067 356.32)` | Tutuji Pink | black, 6.2 to 1 |

## CSS

```css
background: conic-gradient(from 225deg, #071d49 0.000% 20.000%, #123d79 20.000% 40.000%, #2967a5 40.000% 60.000%, #9e276e 60.000% 80.000%, #f04f98 80.000% 100.000%);
background: conic-gradient(from 225deg, oklch(24.41% 0.0868 262.27) 0.000% 20.000%, oklch(36.61% 0.1130 258.04) 20.000% 40.000%, oklch(50.39% 0.1185 251.70) 40.000% 60.000%, oklch(48.43% 0.1681 348.92) 60.000% 80.000%, oklch(66.93% 0.2067 356.32) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.244 | 0.087 | 262.3 |
| 2 | 0.366 | 0.113 | 258 |
| 3 | 0.504 | 0.119 | 251.7 |
| 4 | 0.484 | 0.168 | 348.9 |
| 5 | 0.669 | 0.207 | 356.3 |

## In these collections

- [Pink and blue swatches](https://grabient.com/pink-and-blue-swatches)

## Other forms

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