# Stone, coral and terracotta light mode palette

The Stone, coral and terracotta light mode palette brings together off-white, light purple, light orange, and orange. The colors span a moderate lightness range, combining restrained color with gentle contrast. Its light and open character suits brand mood boards and editorial graphics. Its darkest tone is orange, and its lightest tone is off-white.

- Also called: Pastel gray, lavender and brown linear swatches
- Seed: `kU5grY54_AeuNzDTHL-A`
- Page: https://grabient.com/kU5grY54_AeuNzDTHL-A?style=linearSwatches&steps=4
- Drawn as: linear swatches, 4 steps, 90 degrees
- Kinds: pastel, light
- Hues: two-hue
- Contrast of its darkest and lightest colors: 2.4 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 | `#e2dee7` | `oklch(90.55% 0.0138 304.45)` | Minified Purple | black, 15.7 to 1 |
| 2 | `#cabcd8` | `oklch(81.50% 0.0427 308.68)` | Playful Petal | black, 11.6 to 1 |
| 3 | `#e1c6b7` | `oklch(84.65% 0.0372 52.24)` | Birthday Suit | black, 13 to 1 |
| 4 | `#b88265` | `oklch(65.35% 0.0785 49.07)` | Cognac Brown | black, 6.4 to 1 |

## CSS

```css
background: linear-gradient(90deg, #e2dee7 0.000% 25.000%, #cabcd8 25.000% 50.000%, #e1c6b7 50.000% 75.000%, #b88265 75.000% 100.000%);
background: linear-gradient(90deg, oklch(90.55% 0.0138 304.45) 0.000% 25.000%, oklch(81.50% 0.0427 308.68) 25.000% 50.000%, oklch(84.65% 0.0372 52.24) 50.000% 75.000%, oklch(65.35% 0.0785 49.07) 75.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.906 | 0.014 | 304.5 |
| 2 | 0.815 | 0.043 | 308.7 |
| 3 | 0.846 | 0.037 | 412.2 |
| 4 | 0.654 | 0.079 | 409.1 |

## In these collections

- [Light mode color palette](https://grabient.com/light-mode-color-palette)

## Other forms

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