# Primary Colors: Crimson and ochre

The "Primary Colors: Crimson and ochre" palette brings together red, gold, gray, 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 red, and its lightest tone is gold.

- Also called: Tritone red, tan and blue linear swatches
- Seed: `kYgWMUSapAdosRjiJEBzwhPUSaRO`
- Page: https://grabient.com/kYgWMUSapAdosRjiJEBzwhPUSaRO?style=linearSwatches&steps=6&angle=45
- Drawn as: linear swatches, 6 steps, 45 degrees
- Hues: analogous
- Contrast of its darkest and lightest colors: 3 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 | `#a54036` | `oklch(50.79% 0.1364 28.13)` | Cherry Race | white, 6.2 to 1 |
| 2 | `#b45e4d` | `oklch(57.87% 0.1157 32.35)` | Ginger Spice | black, 4.6 to 1 |
| 3 | `#c39b3b` | `oklch(70.87% 0.1213 85.19)` | Golden Mean | black, 8 to 1 |
| 4 | `#ceb268` | `oklch(77.17% 0.0992 89.42)` | Filtered Rays | black, 10.1 to 1 |
| 5 | `#798a90` | `oklch(62.20% 0.0220 219.40)` | Academy Grey | black, 5.8 to 1 |
| 6 | `#576f99` | `oklch(53.94% 0.0717 261.67)` | Moonshade | white, 5 to 1 |

## CSS

```css
background: linear-gradient(45deg, #a54036 0.000% 16.667%, #b45e4d 16.667% 33.333%, #c39b3b 33.333% 50.000%, #ceb268 50.000% 66.667%, #798a90 66.667% 83.333%, #576f99 83.333% 100.000%);
background: linear-gradient(45deg, oklch(50.79% 0.1364 28.13) 0.000% 16.667%, oklch(57.87% 0.1157 32.35) 16.667% 33.333%, oklch(70.87% 0.1213 85.19) 33.333% 50.000%, oklch(77.17% 0.0992 89.42) 50.000% 66.667%, oklch(62.20% 0.0220 219.40) 66.667% 83.333%, oklch(53.94% 0.0717 261.67) 83.333% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.508 | 0.136 | 28.1 |
| 2 | 0.579 | 0.116 | 32.4 |
| 3 | 0.709 | 0.121 | 85.2 |
| 4 | 0.772 | 0.099 | 89.4 |
| 5 | 0.622 | 0.022 | 219.4 |
| 6 | 0.539 | 0.072 | 261.7 |

## In these collections

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

## Other forms

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