# Crimson, mustard and indigo tetradic palette

The Crimson, mustard and indigo tetradic palette brings together red, gold, green, 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: Pink, tan, green and blue angular swatches
- Seed: `kUonEOZixHdWjSHDJs1g`
- Page: https://grabient.com/kUonEOZixHdWjSHDJs1g?style=angularSwatches&steps=4&angle=45
- Drawn as: angular swatches, 4 steps, 45 degrees
- Kinds: vivid, multicolor
- Hues: two-hue
- Contrast of its darkest and lightest colors: 2.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 | `#da5e64` | `oklch(63.78% 0.1557 19.69)` | Berrylicious | black, 5.7 to 1 |
| 2 | `#e5b75c` | `oklch(80.31% 0.1213 83.09)` | River of Gold | black, 11.2 to 1 |
| 3 | `#63a87c` | `oklch(67.32% 0.0965 154.95)` | Shiny Shamrock | black, 7.4 to 1 |
| 4 | `#5267a8` | `oklch(52.76% 0.1061 269.08)` | Submarine Base | white, 5.4 to 1 |

## CSS

```css
background: conic-gradient(from 45deg, #da5e64 0.000% 25.000%, #e5b75c 25.000% 50.000%, #63a87c 50.000% 75.000%, #5267a8 75.000% 100.000%);
background: conic-gradient(from 45deg, oklch(63.78% 0.1557 19.69) 0.000% 25.000%, oklch(80.31% 0.1213 83.09) 25.000% 50.000%, oklch(67.32% 0.0965 154.95) 50.000% 75.000%, oklch(52.76% 0.1061 269.08) 75.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.638 | 0.156 | 19.7 |
| 2 | 0.803 | 0.121 | 83.1 |
| 3 | 0.673 | 0.096 | 155 |
| 4 | 0.528 | 0.106 | 269.1 |

## In these collections

- [Tetradic color palette](https://grabient.com/tetradic-color-palette)

## Other forms

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