# Primary Colors: Crimson and turquoise

The "Primary Colors: Crimson and turquoise" palette brings together red, gold, teal, and blue. The colors span a moderate lightness range, combining moderate color with gentle contrast. Its balanced and composed character suits brand mood boards and editorial graphics. Its darkest tone is blue, and its lightest tone is gold.

- Also called: Red, tan and blue radial swatches
- Seed: `kWlGUT5ipH1SWzrIJcKuqDBo`
- Page: https://grabient.com/kWlGUT5ipH1SWzrIJcKuqDBo?style=radialSwatches&steps=5&angle=270
- Drawn as: radial swatches, 5 steps, 270 degrees
- Hues: complementary
- Contrast of its darkest and lightest colors: 3.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 | `#c0554b` | `oklch(58.27% 0.1392 27.42)` | Sunset | black, 4.6 to 1 |
| 2 | `#d7bd62` | `oklch(80.31% 0.1157 94.00)` | Mustard Oil | black, 11.3 to 1 |
| 3 | `#679dae` | `oklch(66.54% 0.0620 218.69)` | Left Bank Blue | black, 7 to 1 |
| 4 | `#367dae` | `oklch(56.69% 0.1033 241.94)` | Beijing Blue | black, 4.7 to 1 |
| 5 | `#365989` | `oklch(46.06% 0.0896 256.74)` | Handsome Blue | white, 7.1 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #c0554b 0.000% 20.000%, #d7bd62 20.000% 40.000%, #679dae 40.000% 60.000%, #367dae 60.000% 80.000%, #365989 80.000% 100.000%);
background: radial-gradient(circle at 50% 50%, oklch(58.27% 0.1392 27.42) 0.000% 20.000%, oklch(80.31% 0.1157 94.00) 20.000% 40.000%, oklch(66.54% 0.0620 218.69) 40.000% 60.000%, oklch(56.69% 0.1033 241.94) 60.000% 80.000%, oklch(46.06% 0.0896 256.74) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.583 | 0.139 | 27.4 |
| 2 | 0.803 | 0.116 | 94 |
| 3 | 0.665 | 0.062 | 218.7 |
| 4 | 0.567 | 0.103 | 241.9 |
| 5 | 0.461 | 0.09 | 256.7 |

## In these collections

- [Primary color swatches](https://grabient.com/primary-color-swatches)

## Other forms

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