# Red Signal on Warm Concrete

The Stone and mauve control resonant palette brings together light gray, gray, red, and dark gray. The colors span a broad 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 gray, and its lightest tone is light gray.

- Also called: Gray, red and dark gray linear swatches
- Seed: `kU4wdCyINQkTJUcohy5A`
- Page: https://grabient.com/kU4wdCyINQkTJUcohy5A?style=linearSwatches&steps=4&angle=180
- Drawn as: linear swatches, 4 steps, 180 degrees
- Kinds: light to dark, muted
- Hues: analogous
- Contrast of its darkest and lightest colors: 9.2 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 | `#dedcd5` | `oklch(89.37% 0.0096 93.52)` | River Shark | black, 15.2 to 1 |
| 2 | `#73797c` | `oklch(57.09% 0.0083 234.06)` | Rhinoceros | black, 4.7 to 1 |
| 3 | `#c9202a` | `oklch(53.94% 0.2012 25.18)` | High Risk Red | white, 5.6 to 1 |
| 4 | `#29343b` | `oklch(31.89% 0.0193 236.18)` | Dracula Orchid | white, 12.6 to 1 |

## CSS

```css
background: linear-gradient(180deg, #dedcd5 0.000% 25.000%, #73797c 25.000% 50.000%, #c9202a 50.000% 75.000%, #29343b 75.000% 100.000%);
background: linear-gradient(180deg, oklch(89.37% 0.0096 93.52) 0.000% 25.000%, oklch(57.09% 0.0083 234.06) 25.000% 50.000%, oklch(53.94% 0.2012 25.18) 50.000% 75.000%, oklch(31.89% 0.0193 236.18) 75.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.894 | 0.01 | 93.5 |
| 2 | 0.571 | 0.008 | 234.1 |
| 3 | 0.539 | 0.201 | 385.2 |
| 4 | 0.319 | 0.019 | 236.2 |

## In these collections

- [Control Resonant swatches](https://grabient.com/control-resonant-swatches)
- [Red and black](https://grabient.com/red-and-black)

## Other forms

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