# Pastel orange to gray linear gradient

Pastel orange to gray linear gradient with 32 colors: #ff834d, #ff854e, #ff8951, #ff8d54, #ff9157, #ff955a, #ff995d, #ff9d60, #ffa164, #fea669, #feaa6d, #fdae72, #fcb276, #fab57b, #f9b97f, #f7bc83, #f5bf88, #f3c28c, #f0c591, #ecc897, #e9c99f, #e6cba7, #e2ccaf, #ddcdb6, #d8cfbb, #d2d0bf, #ccd0c3, #c5d1c7, #c0d0cd, #beced2, #bfcbd5, #c2c9d6. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kYvHke4zRA2ipQRsHMGbIjCmoHU6`
- Page: https://grabient.com/kYvHke4zRA2ipQRsHMGbIjCmoHU6?steps=32&angle=0
- Drawn as: linear gradient, 32 steps, 0 degrees
- Kinds: even lightness, pastel, light, warm
- Hues: analogous
- Contrast of its darkest and lightest colors: 1.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 | `#ff834d` | `oklch(74.01% 0.1662 42.89)` | Tangerine Dream | black, 8.5 to 1 |
| 2 | `#ff854e` | `oklch(74.42% 0.1636 43.64)` | Poached Rainbow Trout | black, 8.7 to 1 |
| 3 | `#ff8951` | `oklch(74.98% 0.1601 44.66)` | Tiger of Mysore | black, 8.9 to 1 |
| 4 | `#ff8d54` | `oklch(75.64% 0.1561 45.87)` | Paradise Bird | black, 9.1 to 1 |
| 5 | `#ff9157` | `oklch(76.37% 0.1518 47.21)` | Fire Orange | black, 9.4 to 1 |
| 6 | `#ff955a` | `oklch(77.11% 0.1475 48.61)` | Rainbow Trout | black, 9.7 to 1 |
| 7 | `#ff995d` | `oklch(77.82% 0.1435 50.02)` | Papaya | black, 9.9 to 1 |
| 8 | `#ff9d60` | `oklch(78.50% 0.1398 51.38)` | Orange Spice | black, 10.2 to 1 |
| 9 | `#ffa164` | `oklch(79.23% 0.1351 52.77)` | Peach Cobbler | black, 10.5 to 1 |
| 10 | `#fea669` | `oklch(79.97% 0.1303 54.20)` | Echinoderm | black, 10.8 to 1 |
| 11 | `#feaa6d` | `oklch(80.70% 0.1253 55.71)` | Transparent Orange | black, 11.1 to 1 |
| 12 | `#fdae72` | `oklch(81.40% 0.1203 57.32)` | Bloom | black, 11.4 to 1 |
| 13 | `#fcb276` | `oklch(82.05% 0.1151 59.06)` | Market Melon | black, 11.7 to 1 |
| 14 | `#fab57b` | `oklch(82.62% 0.1099 60.93)` | Market Melon | black, 12 to 1 |
| 15 | `#f9b97f` | `oklch(83.16% 0.1049 62.83)` | Asagi Yellow | black, 12.2 to 1 |
| 16 | `#f7bc83` | `oklch(83.67% 0.0999 64.83)` | Apricot Yellow | black, 12.4 to 1 |
| 17 | `#f5bf88` | `oklch(84.13% 0.0947 66.96)` | Melon Balls | black, 12.7 to 1 |
| 18 | `#f3c28c` | `oklch(84.53% 0.0890 69.29)` | Ginger Root Peel | black, 12.9 to 1 |
| 19 | `#f0c591` | `oklch(84.87% 0.0827 71.86)` | Ginger Root Peel | black, 13 to 1 |
| 20 | `#ecc897` | `oklch(85.14% 0.0755 74.45)` | Humble Gold | black, 13.2 to 1 |
| 21 | `#e9c99f` | `oklch(85.33% 0.0665 75.12)` | Compatible Cream | black, 13.3 to 1 |
| 22 | `#e6cba7` | `oklch(85.47% 0.0564 74.86)` | Caramel Mousse | black, 13.4 to 1 |
| 23 | `#e2ccaf` | `oklch(85.55% 0.0460 75.40)` | Macadamia | black, 13.4 to 1 |
| 24 | `#ddcdb6` | `oklch(85.56% 0.0363 78.45)` | Estate Limestone | black, 13.4 to 1 |
| 25 | `#d8cfbb` | `oklch(85.52% 0.0282 85.72)` | Warm Oats | black, 13.5 to 1 |
| 26 | `#d2d0bf` | `oklch(85.40% 0.0225 99.01)` | Turnstone | black, 13.4 to 1 |
| 27 | `#ccd0c3` | `oklch(85.17% 0.0194 121.45)` | Glass Tile | black, 13.4 to 1 |
| 28 | `#c5d1c7` | `oklch(84.83% 0.0180 151.06)` | Fountain Foam | black, 13.2 to 1 |
| 29 | `#c0d0cd` | `oklch(84.43% 0.0179 183.92)` | White Box | black, 13.1 to 1 |
| 30 | `#beced2` | `oklch(84.04% 0.0185 216.09)` | Shhh… | black, 12.9 to 1 |
| 31 | `#bfcbd5` | `oklch(83.70% 0.0192 243.66)` | Melody | black, 12.7 to 1 |
| 32 | `#c2c9d6` | `oklch(83.46% 0.0193 262.69)` | Icy Brook | black, 12.6 to 1 |

## CSS

```css
background: linear-gradient(0deg, #ff834d 0.0%, #ff854e 3.2%, #ff8951 6.5%, #ff8d54 9.7%, #ff9157 12.9%, #ff955a 16.1%, #ff995d 19.4%, #ff9d60 22.6%, #ffa164 25.8%, #fea669 29.0%, #feaa6d 32.3%, #fdae72 35.5%, #fcb276 38.7%, #fab57b 41.9%, #f9b97f 45.2%, #f7bc83 48.4%, #f5bf88 51.6%, #f3c28c 54.8%, #f0c591 58.1%, #ecc897 61.3%, #e9c99f 64.5%, #e6cba7 67.7%, #e2ccaf 71.0%, #ddcdb6 74.2%, #d8cfbb 77.4%, #d2d0bf 80.6%, #ccd0c3 83.9%, #c5d1c7 87.1%, #c0d0cd 90.3%, #beced2 93.5%, #bfcbd5 96.8%, #c2c9d6 100.0%);
background: linear-gradient(0deg in oklch, oklch(74.01% 0.1662 42.89) 0.0%, oklch(74.42% 0.1636 43.64) 3.2%, oklch(74.98% 0.1601 44.66) 6.5%, oklch(75.64% 0.1561 45.87) 9.7%, oklch(76.37% 0.1518 47.21) 12.9%, oklch(77.11% 0.1475 48.61) 16.1%, oklch(77.82% 0.1435 50.02) 19.4%, oklch(78.50% 0.1398 51.38) 22.6%, oklch(79.23% 0.1351 52.77) 25.8%, oklch(79.97% 0.1303 54.20) 29.0%, oklch(80.70% 0.1253 55.71) 32.3%, oklch(81.40% 0.1203 57.32) 35.5%, oklch(82.05% 0.1151 59.06) 38.7%, oklch(82.62% 0.1099 60.93) 41.9%, oklch(83.16% 0.1049 62.83) 45.2%, oklch(83.67% 0.0999 64.83) 48.4%, oklch(84.13% 0.0947 66.96) 51.6%, oklch(84.53% 0.0890 69.29) 54.8%, oklch(84.87% 0.0827 71.86) 58.1%, oklch(85.14% 0.0755 74.45) 61.3%, oklch(85.33% 0.0665 75.12) 64.5%, oklch(85.47% 0.0564 74.86) 67.7%, oklch(85.55% 0.0460 75.40) 71.0%, oklch(85.56% 0.0363 78.45) 74.2%, oklch(85.52% 0.0282 85.72) 77.4%, oklch(85.40% 0.0225 99.01) 80.6%, oklch(85.17% 0.0194 121.45) 83.9%, oklch(84.83% 0.0180 151.06) 87.1%, oklch(84.43% 0.0179 183.92) 90.3%, oklch(84.04% 0.0185 216.09) 93.5%, oklch(83.70% 0.0192 243.66) 96.8%, oklch(83.46% 0.0193 262.69) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.74 | 0.167 | 42.9 |
| 2 | 0.78 | 0.143 | 50.3 |
| 3 | 0.823 | 0.113 | 59.8 |
| 4 | 0.85 | 0.079 | 73.5 |
| 5 | 0.854 | 0.023 | 95.7 |
| 6 | 0.835 | 0.019 | 262.7 |

## In these collections

- [Orange and blue gradients](https://grabient.com/orange-and-blue-gradients)

## Other forms

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