# Cream, sage and stone color palette

The Cream, sage and stone color palette brings together pale orange, light orange, teal, and light purple. The colors span a moderate lightness range, combining restrained color with clear contrast. Its light and open character suits brand mood boards and editorial graphics. Its darkest tone is teal, and its lightest tone is pale orange.

- Also called: Triadic beige, teal, gray and lavender linear gradient
- Seed: `kU6BsxX5o80aPVHjEMxA`
- Page: https://grabient.com/kU6BsxX5o80aPVHjEMxA?steps=32&angle=135
- Drawn as: linear gradient, 32 steps, 135 degrees
- Kinds: dark center, pastel
- Hues: two-hue
- Contrast of its darkest and lightest colors: 3.5 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 | `#f3dfc9` | `oklch(91.34% 0.0372 68.91)` | So Much Fawn | black, 16.1 to 1 |
| 2 | `#f2dbc4` | `oklch(90.43% 0.0395 66.55)` | Subtle Blush | black, 15.7 to 1 |
| 3 | `#f1d6bf` | `oklch(89.28% 0.0427 62.44)` | Iced Apricot | black, 15.1 to 1 |
| 4 | `#f0d0ba` | `oklch(87.94% 0.0466 57.19)` | Desert Mesa | black, 14.4 to 1 |
| 5 | `#efcab5` | `oklch(86.43% 0.0510 51.43)` | Bare Necessity | black, 13.7 to 1 |
| 6 | `#edc3af` | `oklch(84.78% 0.0556 45.76)` | Zinnwaldite | black, 12.9 to 1 |
| 7 | `#ebbbaa` | `oklch(83.04% 0.0600 40.80)` | Spicy Hummus | black, 12.2 to 1 |
| 8 | `#e7b4a5` | `oklch(81.24% 0.0641 37.16)` | City of Pink Angels | black, 11.4 to 1 |
| 9 | `#e3ad9e` | `oklch(79.40% 0.0676 35.46)` | Pale Blush | black, 10.7 to 1 |
| 10 | `#dfa797` | `oklch(77.57% 0.0701 36.31)` | Cedarville | black, 10 to 1 |
| 11 | `#d9a28e` | `oklch(75.78% 0.0715 40.34)` | Apricotta | black, 9.4 to 1 |
| 12 | `#d19e83` | `oklch(73.94% 0.0715 48.16)` | Orange Maple | black, 8.8 to 1 |
| 13 | `#c59a78` | `oklch(71.76% 0.0701 59.86)` | Copper Moon | black, 8.2 to 1 |
| 14 | `#b5976d` | `oklch(69.33% 0.0676 74.72)` | Tapestry Gold | black, 7.6 to 1 |
| 15 | `#a39467` | `oklch(66.76% 0.0643 92.02)` | Olive Rush | black, 6.9 to 1 |
| 16 | `#8e9166` | `oklch(64.19% 0.0604 111.03)` | Nick’s Nook | black, 6.3 to 1 |
| 17 | `#7a8d69` | `oklch(61.74% 0.0563 131.02)` | Crispy Crunch | black, 5.8 to 1 |
| 18 | `#68886f` | `oklch(59.53% 0.0522 151.26)` | Shale Green | black, 5.3 to 1 |
| 19 | `#5c8376` | `oklch(57.69% 0.0483 171.01)` | Idyllic Island | black, 4.9 to 1 |
| 20 | `#567e7b` | `oklch(56.34% 0.0450 189.56)` | Green Hour | black, 4.6 to 1 |
| 21 | `#567b80` | `oklch(55.60% 0.0424 206.16)` | Labradorite Green | white, 4.6 to 1 |
| 22 | `#597984` | `oklch(55.61% 0.0410 220.26)` | Catalina Coast | white, 4.6 to 1 |
| 23 | `#5f7a8a` | `oklch(56.51% 0.0402 233.41)` | Night Owl | black, 4.6 to 1 |
| 24 | `#687e92` | `oklch(58.17% 0.0400 246.13)` | Cascade Tour | black, 4.9 to 1 |
| 25 | `#73839a` | `oklch(60.42% 0.0403 258.31)` | Stonewash | black, 5.4 to 1 |
| 26 | `#8089a3` | `oklch(63.09% 0.0408 269.86)` | Violet Aura | black, 6 to 1 |
| 27 | `#8d90ac` | `oklch(66.00% 0.0417 280.68)` | Sephiroth Grey | black, 6.7 to 1 |
| 28 | `#9b97b4` | `oklch(68.96% 0.0426 290.68)` | Heirloom Lilac | black, 7.4 to 1 |
| 29 | `#a89ebc` | `oklch(71.82% 0.0435 299.74)` | Fragrant Satchel | black, 8.3 to 1 |
| 30 | `#b4a5c2` | `oklch(74.39% 0.0444 307.79)` | Pixieland | black, 9 to 1 |
| 31 | `#beaac7` | `oklch(76.49% 0.0451 314.71)` | Fancy Pansy | black, 9.7 to 1 |
| 32 | `#c5aeca` | `oklch(77.95% 0.0455 320.41)` | Purple Chalk | black, 10.2 to 1 |

## CSS

```css
background: linear-gradient(135deg, #f3dfc9 0.0%, #f2dbc4 3.2%, #f1d6bf 6.5%, #f0d0ba 9.7%, #efcab5 12.9%, #edc3af 16.1%, #ebbbaa 19.4%, #e7b4a5 22.6%, #e3ad9e 25.8%, #dfa797 29.0%, #d9a28e 32.3%, #d19e83 35.5%, #c59a78 38.7%, #b5976d 41.9%, #a39467 45.2%, #8e9166 48.4%, #7a8d69 51.6%, #68886f 54.8%, #5c8376 58.1%, #567e7b 61.3%, #567b80 64.5%, #597984 67.7%, #5f7a8a 71.0%, #687e92 74.2%, #73839a 77.4%, #8089a3 80.6%, #8d90ac 83.9%, #9b97b4 87.1%, #a89ebc 90.3%, #b4a5c2 93.5%, #beaac7 96.8%, #c5aeca 100.0%);
background: linear-gradient(135deg in oklch, oklch(91.34% 0.0372 68.91) 0.0%, oklch(90.43% 0.0395 66.55) 3.2%, oklch(89.28% 0.0427 62.44) 6.5%, oklch(87.94% 0.0466 57.19) 9.7%, oklch(86.43% 0.0510 51.43) 12.9%, oklch(84.78% 0.0556 45.76) 16.1%, oklch(83.04% 0.0600 40.80) 19.4%, oklch(81.24% 0.0641 37.16) 22.6%, oklch(79.40% 0.0676 35.46) 25.8%, oklch(77.57% 0.0701 36.31) 29.0%, oklch(75.78% 0.0715 40.34) 32.3%, oklch(73.94% 0.0715 48.16) 35.5%, oklch(71.76% 0.0701 59.86) 38.7%, oklch(69.33% 0.0676 74.72) 41.9%, oklch(66.76% 0.0643 92.02) 45.2%, oklch(64.19% 0.0604 111.03) 48.4%, oklch(61.74% 0.0563 131.02) 51.6%, oklch(59.53% 0.0522 151.26) 54.8%, oklch(57.69% 0.0483 171.01) 58.1%, oklch(56.34% 0.0450 189.56) 61.3%, oklch(55.60% 0.0424 206.16) 64.5%, oklch(55.61% 0.0410 220.26) 67.7%, oklch(56.51% 0.0402 233.41) 71.0%, oklch(58.17% 0.0400 246.13) 74.2%, oklch(60.42% 0.0403 258.31) 77.4%, oklch(63.09% 0.0408 269.86) 80.6%, oklch(66.00% 0.0417 280.68) 83.9%, oklch(68.96% 0.0426 290.68) 87.1%, oklch(71.82% 0.0435 299.74) 90.3%, oklch(74.39% 0.0444 307.79) 93.5%, oklch(76.49% 0.0451 314.71) 96.8%, oklch(77.95% 0.0455 320.41) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.913 | 0.037 | 68.9 |
| 2 | 0.752 | 0.072 | 42.5 |
| 3 | 0.555 | 0.041 | 215.8 |
| 4 | 0.78 | 0.045 | 320.4 |

## In these collections

- [Soft multicolor gradients](https://grabient.com/soft-multicolor-gradients)
- [Jacaranda first bloom](https://grabient.com/jacaranda-first-bloom)
- [Gold border jasmine garland](https://grabient.com/gold-border-jasmine-garland)

## Other forms

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