# Stone, deep teal and crimson color palette

The Stone, deep teal and crimson color palette brings together off-white, dark gray, teal, blue, and red. The colors span a broad lightness range, combining strong color with clear contrast. Its bold and dramatic character suits presentation backgrounds and section dividers. Its darkest tone is dark gray, and its lightest tone is off-white.

- Also called: Gray, teal, blue and salmon linear swatches
- Seed: `kW7AuDoAW_8ivP_MOkcVrNQw`
- Page: https://grabient.com/kW7AuDoAW_8ivP_MOkcVrNQw?style=linearSwatches&steps=5
- Drawn as: linear swatches, 5 steps, 90 degrees
- Kinds: dark center, vivid
- Hues: multi-hue
- Contrast of its darkest and lightest colors: 12.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 | `#ddebe9` | `oklch(92.91% 0.0152 184.92)` | Honesty | black, 17.1 to 1 |
| 2 | `#1a2523` | `oklch(25.20% 0.0152 184.92)` | Shadow Warrior | white, 15.8 to 1 |
| 3 | `#008a7f` | `oklch(57.09% 0.1006 184.92)` | Go Go Green | black, 4.9 to 1 |
| 4 | `#0086d3` | `oklch(59.84% 0.1512 245.17)` | Calgar Blue | black, 5.3 to 1 |
| 5 | `#e27367` | `oklch(68.11% 0.1406 27.82)` | Burnt Coral | black, 6.8 to 1 |

## CSS

```css
background: linear-gradient(90deg, #ddebe9 0.000% 20.000%, #1a2523 20.000% 40.000%, #008a7f 40.000% 60.000%, #0086d3 60.000% 80.000%, #e27367 80.000% 100.000%);
background: linear-gradient(90deg, oklch(92.91% 0.0152 184.92) 0.000% 20.000%, oklch(25.20% 0.0152 184.92) 20.000% 40.000%, oklch(57.09% 0.1006 184.92) 40.000% 60.000%, oklch(59.84% 0.1512 245.17) 60.000% 80.000%, oklch(68.11% 0.1406 27.82) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.929 | 0.015 | 184.9 |
| 2 | 0.252 | 0.015 | 184.9 |
| 3 | 0.571 | 0.13 | 184.9 |
| 4 | 0.598 | 0.16 | 245.2 |
| 5 | 0.681 | 0.141 | 387.8 |

## In these collections

- [Modern swatches](https://grabient.com/modern-swatches)
- [Presentation swatches](https://grabient.com/presentation-swatches)

## Other forms

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