# Orange and sage spring palette

The Orange and sage spring palette brings together light orange, light red, light green, green, and teal. The colors span a narrow lightness range, combining moderate color with gentle contrast. Its light and open character suits seasonal campaigns and event graphics. Its darkest tone is teal, and its lightest tone is light orange.

- Also called: Analogous peach, pink, tan and gray angular gradient
- Seed: `kc2EkvZyc6mIxPtiJkN5pRD2OKRZWDcGzZBGw`
- Page: https://grabient.com/kc2EkvZyc6mIxPtiJkN5pRD2OKRZWDcGzZBGw?style=angularGradient&steps=9&angle=225
- Drawn as: angular gradient, 9 steps, 225 degrees
- Kinds: pastel
- Hues: analogous
- Contrast of its darkest and lightest colors: 2.3 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 | `#fbc186` | `oklch(85.04% 0.1006 66.09)` | Buttery | black, 13 to 1 |
| 2 | `#ffa9a1` | `oklch(81.62% 0.1034 24.93)` | Corally | black, 11.4 to 1 |
| 3 | `#fe92a4` | `oklch(77.87% 0.1317 9.93)` | Salmon Pink | black, 9.8 to 1 |
| 4 | `#f69589` | `oklch(76.73% 0.1200 27.69)` | Adobe Avenue | black, 9.5 to 1 |
| 5 | `#e3ae89` | `oklch(79.08% 0.0797 55.99)` | Ancient Inca | black, 10.6 to 1 |
| 6 | `#c9bfa2` | `oklch(80.62% 0.0415 91.68)` | Washed Olive | black, 11.4 to 1 |
| 7 | `#adb5a2` | `oklch(76.18% 0.0274 126.03)` | Stormy Day | black, 9.9 to 1 |
| 8 | `#889a85` | `oklch(66.65% 0.0382 141.43)` | Green Clay | black, 7 to 1 |
| 9 | `#648c8b` | `oklch(61.02% 0.0441 193.96)` | Tasmanian Sea | black, 5.6 to 1 |

## CSS

```css
background: conic-gradient(from 225deg, #fbc186 0.0%, #ffa9a1 12.5%, #fe92a4 25.0%, #f69589 37.5%, #e3ae89 50.0%, #c9bfa2 62.5%, #adb5a2 75.0%, #889a85 87.5%, #648c8b 100.0%);
background: conic-gradient(from 225deg in oklch, oklch(85.04% 0.1006 66.09) 0.0%, oklch(81.62% 0.1034 24.93) 12.5%, oklch(77.87% 0.1317 9.93) 25.0%, oklch(76.73% 0.1200 27.69) 37.5%, oklch(79.08% 0.0797 55.99) 50.0%, oklch(80.62% 0.0415 91.68) 62.5%, oklch(76.18% 0.0274 126.03) 75.0%, oklch(66.65% 0.0382 141.43) 87.5%, oklch(61.02% 0.0441 193.96) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.85 | 0.101 | 66.1 |
| 2 | 0.811 | 0.107 | 20.7 |
| 3 | 0.772 | 0.135 | 11.1 |
| 4 | 0.772 | 0.105 | 40.7 |
| 5 | 0.807 | 0.055 | 73.5 |
| 6 | 0.783 | 0.028 | 121 |
| 7 | 0.677 | 0.037 | 135.8 |
| 8 | 0.61 | 0.044 | 194 |

## In these collections

- [Spring gradients](https://grabient.com/spring-gradients)
- [Jasmine harvest dawn](https://grabient.com/jasmine-harvest-dawn)

## Other forms

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