# Monochrome off-white to brown linear gradient

Monochrome off-white to brown linear gradient with 32 colors: #fef9e6, #fef7e4, #fdf6e0, #fcf4dc, #faf2d7, #f9efd2, #f7edcd, #f6eac8, #f4e8c3, #f2e5bd, #f1e3b8, #efe0b2, #edddac, #ebdaa6, #e9d7a0, #e6d49a, #e4d095, #e1cd8f, #dfca89, #dcc684, #d9c37e, #d6bf79, #d3bb73, #cfb66e, #cbb269, #c6ac64, #c1a65e, #bc9f59, #b69954, #b19450, #ad8f4d, #aa8c4a. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kW-RJB9pI_-4cv_jIz_UyG_I`
- Page: https://grabient.com/kW-RJB9pI_-4cv_jIz_UyG_I?steps=32&angle=270
- Drawn as: linear gradient, 32 steps, 270 degrees
- Kinds: light to dark, pastel, light, warm, monochrome
- Hues: monochromatic
- Contrast of its darkest and lightest colors: 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 | `#fef9e6` | `oklch(98.03% 0.0248 92.11)` | Down Feathers | black, 19.8 to 1 |
| 2 | `#fef7e4` | `oklch(97.67% 0.0268 92.11)` | Sweet Frosting | black, 19.6 to 1 |
| 3 | `#fdf6e0` | `oklch(97.20% 0.0293 92.11)` | Crème de Pêche | black, 19.3 to 1 |
| 4 | `#fcf4dc` | `oklch(96.64% 0.0324 92.11)` | Tulip Petals | black, 19 to 1 |
| 5 | `#faf2d7` | `oklch(96.01% 0.0358 92.11)` | French Porcelain Clay | black, 18.7 to 1 |
| 6 | `#f9efd2` | `oklch(95.32% 0.0395 92.11)` | Daylily Yellow | black, 18.3 to 1 |
| 7 | `#f7edcd` | `oklch(94.60% 0.0432 92.11)` | Blonde Shell | black, 17.9 to 1 |
| 8 | `#f6eac8` | `oklch(93.86% 0.0469 92.11)` | Lemon Icing | black, 17.5 to 1 |
| 9 | `#f4e8c3` | `oklch(93.12% 0.0505 92.11)` | Pear Sorbet | black, 17.1 to 1 |
| 10 | `#f2e5bd` | `oklch(92.36% 0.0542 92.12)` | Creamy Vanilla | black, 16.7 to 1 |
| 11 | `#f1e3b8` | `oklch(91.57% 0.0580 92.14)` | James Blonde | black, 16.3 to 1 |
| 12 | `#efe0b2` | `oklch(90.74% 0.0620 92.16)` | Cookies and Cream | black, 15.9 to 1 |
| 13 | `#edddac` | `oklch(89.88% 0.0660 92.18)` | Creamy Ivory | black, 15.5 to 1 |
| 14 | `#ebdaa6` | `oklch(88.99% 0.0699 92.19)` | Studio Cream | black, 15.1 to 1 |
| 15 | `#e9d7a0` | `oklch(88.06% 0.0736 92.18)` | Leaf Yellow | black, 14.6 to 1 |
| 16 | `#e6d49a` | `oklch(87.11% 0.0770 92.14)` | Lifeless Planet | black, 14.2 to 1 |
| 17 | `#e4d095` | `oklch(86.12% 0.0801 92.08)` | Garden Picket | black, 13.7 to 1 |
| 18 | `#e1cd8f` | `oklch(85.12% 0.0830 92.05)` | Bongo Skin | black, 13.3 to 1 |
| 19 | `#dfca89` | `oklch(84.10% 0.0859 92.03)` | Master Key | black, 12.9 to 1 |
| 20 | `#dcc684` | `oklch(83.06% 0.0886 92.00)` | 24 Karat | black, 12.4 to 1 |
| 21 | `#d9c37e` | `oklch(81.96% 0.0911 91.92)` | Germania | black, 12 to 1 |
| 22 | `#d6bf79` | `oklch(80.81% 0.0932 91.78)` | Morning’s Egg | black, 11.5 to 1 |
| 23 | `#d3bb73` | `oklch(79.59% 0.0949 91.53)` | Good as Gold | black, 11 to 1 |
| 24 | `#cfb66e` | `oklch(78.29% 0.0962 91.17)` | Trumpet | black, 10.6 to 1 |
| 25 | `#cbb269` | `oklch(76.84% 0.0969 90.62)` | Canadian Maple | black, 10 to 1 |
| 26 | `#c6ac64` | `oklch(75.13% 0.0969 89.85)` | Hedgehog Cactus Yellow Green | black, 9.4 to 1 |
| 27 | `#c1a65e` | `oklch(73.26% 0.0965 88.94)` | Nonpareil Apple | black, 8.8 to 1 |
| 28 | `#bc9f59` | `oklch(71.35% 0.0956 87.94)` | Eaton Gold | black, 8.2 to 1 |
| 29 | `#b69954` | `oklch(69.50% 0.0946 86.95)` | Viva Las Vegas | black, 7.6 to 1 |
| 30 | `#b19450` | `oklch(67.81% 0.0936 86.03)` | Obsession | black, 7.2 to 1 |
| 31 | `#ad8f4d` | `oklch(66.39% 0.0928 85.26)` | Golden Years | black, 6.8 to 1 |
| 32 | `#aa8c4a` | `oklch(65.35% 0.0923 84.71)` | Golden Years | black, 6.5 to 1 |

## CSS

```css
background: linear-gradient(270deg, #fef9e6 0.0%, #fef7e4 3.2%, #fdf6e0 6.5%, #fcf4dc 9.7%, #faf2d7 12.9%, #f9efd2 16.1%, #f7edcd 19.4%, #f6eac8 22.6%, #f4e8c3 25.8%, #f2e5bd 29.0%, #f1e3b8 32.3%, #efe0b2 35.5%, #edddac 38.7%, #ebdaa6 41.9%, #e9d7a0 45.2%, #e6d49a 48.4%, #e4d095 51.6%, #e1cd8f 54.8%, #dfca89 58.1%, #dcc684 61.3%, #d9c37e 64.5%, #d6bf79 67.7%, #d3bb73 71.0%, #cfb66e 74.2%, #cbb269 77.4%, #c6ac64 80.6%, #c1a65e 83.9%, #bc9f59 87.1%, #b69954 90.3%, #b19450 93.5%, #ad8f4d 96.8%, #aa8c4a 100.0%);
background: linear-gradient(270deg in oklch, oklch(98.03% 0.0248 92.11) 0.0%, oklch(97.67% 0.0268 92.11) 3.2%, oklch(97.20% 0.0293 92.11) 6.5%, oklch(96.64% 0.0324 92.11) 9.7%, oklch(96.01% 0.0358 92.11) 12.9%, oklch(95.32% 0.0395 92.11) 16.1%, oklch(94.60% 0.0432 92.11) 19.4%, oklch(93.86% 0.0469 92.11) 22.6%, oklch(93.12% 0.0505 92.11) 25.8%, oklch(92.36% 0.0542 92.12) 29.0%, oklch(91.57% 0.0580 92.14) 32.3%, oklch(90.74% 0.0620 92.16) 35.5%, oklch(89.88% 0.0660 92.18) 38.7%, oklch(88.99% 0.0699 92.19) 41.9%, oklch(88.06% 0.0736 92.18) 45.2%, oklch(87.11% 0.0770 92.14) 48.4%, oklch(86.12% 0.0801 92.08) 51.6%, oklch(85.12% 0.0830 92.05) 54.8%, oklch(84.10% 0.0859 92.03) 58.1%, oklch(83.06% 0.0886 92.00) 61.3%, oklch(81.96% 0.0911 91.92) 64.5%, oklch(80.81% 0.0932 91.78) 67.7%, oklch(79.59% 0.0949 91.53) 71.0%, oklch(78.29% 0.0962 91.17) 74.2%, oklch(76.84% 0.0969 90.62) 77.4%, oklch(75.13% 0.0969 89.85) 80.6%, oklch(73.26% 0.0965 88.94) 83.9%, oklch(71.35% 0.0956 87.94) 87.1%, oklch(69.50% 0.0946 86.95) 90.3%, oklch(67.81% 0.0936 86.03) 93.5%, oklch(66.39% 0.0928 85.26) 96.8%, oklch(65.35% 0.0923 84.71) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.98 | 0.025 | 92.1 |
| 2 | 0.933 | 0.05 | 92.1 |
| 3 | 0.866 | 0.079 | 92.1 |
| 4 | 0.78 | 0.096 | 91.1 |
| 5 | 0.654 | 0.092 | 84.7 |

## In these collections

- [Desert swatches](https://grabient.com/desert-swatches)
- [Sky](https://grabient.com/sky)
- [Gold swatches](https://grabient.com/gold-swatches)

## Other forms

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