# Blue and crimson split complementary palette

The Blue and crimson split complementary palette brings together blue, light blue, gold, and red. 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 blue, and its lightest tone is gold.

- Also called: Blue, gray, yellow and salmon radial swatches
- Seed: `kWaESwyqC_mWMPjnMS7Tzo5Y`
- Page: https://grabient.com/kWaESwyqC_mWMPjnMS7Tzo5Y?style=radialSwatches&steps=5&angle=0
- Drawn as: radial swatches, 5 steps, 0 degrees
- Kinds: light center
- Hues: complementary
- Contrast of its darkest and lightest colors: 4.8 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 | `#184d7a` | `oklch(40.94% 0.0937 248.20)` | Seashell Cove | white, 8.8 to 1 |
| 2 | `#4c82ae` | `oklch(58.66% 0.0896 245.03)` | Seabrook | black, 5 to 1 |
| 3 | `#a9c2cf` | `oklch(79.92% 0.0331 230.24)` | Drenched | black, 11.2 to 1 |
| 4 | `#e9ba4e` | `oklch(81.10% 0.1350 85.46)` | Blockchain Gold | black, 11.5 to 1 |
| 5 | `#d65a48` | `oklch(62.20% 0.1598 30.51)` | Flame Stitch | black, 5.4 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #184d7a 0.000% 20.000%, #4c82ae 20.000% 40.000%, #a9c2cf 40.000% 60.000%, #e9ba4e 60.000% 80.000%, #d65a48 80.000% 100.000%);
background: radial-gradient(circle at 50% 50%, oklch(40.94% 0.0937 248.20) 0.000% 20.000%, oklch(58.66% 0.0896 245.03) 20.000% 40.000%, oklch(79.92% 0.0331 230.24) 40.000% 60.000%, oklch(81.10% 0.1350 85.46) 60.000% 80.000%, oklch(62.20% 0.1598 30.51) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.409 | 0.094 | 248.2 |
| 2 | 0.587 | 0.09 | 245 |
| 3 | 0.799 | 0.033 | 230.2 |
| 4 | 0.811 | 0.135 | 85.5 |
| 5 | 0.622 | 0.16 | 30.5 |

## In these collections

- [Split complementary swatches](https://grabient.com/split-complementary-swatches)

## Other forms

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