# Monochrome brown to gray linear gradient Monochrome brown to gray linear gradient with 32 colors: #655839, #675a3a, #6a5d3a, #6e613a, #71653b, #75693d, #796e40, #7c7344, #80784a, #857e51, #898459, #8d8960, #908e67, #91916e, #919475, #91967d, #919783, #919788, #92968b, #92958c, #91928b, #8f8e89, #8c8a86, #888682, #84817e, #807d7a, #7c7876, #777370, #716d6a, #6d6864, #696460, #66615c. Edit it and copy or download CSS, SVG, PNG or shader code. - Seed: `kYdiM9xJhBNGTQPUhUIS4I4j8DwQ` - Page: https://grabient.com/kYdiM9xJhBNGTQPUhUIS4I4j8DwQ?steps=32 - Drawn as: linear gradient, 32 steps, 90 degrees - Kinds: neutral - 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 | `#655839` | `oklch(46.46% 0.0482 86.48)` | Beach Casuarina | white, 6.9 to 1 | | 2 | `#675a3a` | `oklch(47.21% 0.0504 87.61)` | Beach Casuarina | white, 6.7 to 1 | | 3 | `#6a5d3a` | `oklch(48.22% 0.0538 89.19)` | Plum Green | white, 6.4 to 1 | | 4 | `#6e613a` | `oklch(49.43% 0.0577 91.04)` | Rationality | white, 6.1 to 1 | | 5 | `#71653b` | `oklch(50.78% 0.0614 93.03)` | Nutria | white, 5.7 to 1 | | 6 | `#75693d` | `oklch(52.20% 0.0644 94.98)` | Sphagnum Moss | white, 5.4 to 1 | | 7 | `#796e40` | `oklch(53.65% 0.0660 96.74)` | Crease | white, 5.1 to 1 | | 8 | `#7c7344` | `oklch(55.18% 0.0661 98.18)` | Fern Shade | white, 4.7 to 1 | | 9 | `#80784a` | `oklch(56.94% 0.0652 99.38)` | Tropical Twist | black, 4.7 to 1 | | 10 | `#857e51` | `oklch(58.81% 0.0635 100.48)` | Xena | black, 5.1 to 1 | | 11 | `#898459` | `oklch(60.66% 0.0610 101.64)` | Aged Eucalyptus | black, 5.5 to 1 | | 12 | `#8d8960` | `oklch(62.34% 0.0578 103.00)` | Oregano Spice | black, 5.8 to 1 | | 13 | `#908e67` | `oklch(63.73% 0.0540 104.70)` | Paid in Full | black, 6.2 to 1 | | 14 | `#91916e` | `oklch(64.75% 0.0495 107.21)` | Extra Mile | black, 6.4 to 1 | | 15 | `#919475` | `oklch(65.58% 0.0434 111.45)` | Dry Hemlock | black, 6.6 to 1 | | 16 | `#91967d` | `oklch(66.20% 0.0364 116.47)` | Veranda Green | black, 6.8 to 1 | | 17 | `#919783` | `oklch(66.61% 0.0291 121.13)` | Hillside Green | black, 6.9 to 1 | | 18 | `#919788` | `oklch(66.79% 0.0222 124.30)` | Smoke & Ash | black, 7 to 1 | | 19 | `#92968b` | `oklch(66.71% 0.0164 124.86)` | Shady Willow | black, 6.9 to 1 | | 20 | `#92958c` | `oklch(66.35% 0.0124 121.58)` | Illusive Green | black, 6.8 to 1 | | 21 | `#91928b` | `oklch(65.63% 0.0096 113.41)` | Illusive Green | black, 6.6 to 1 | | 22 | `#8f8e89` | `oklch(64.61% 0.0078 101.88)` | Letter Grey | black, 6.4 to 1 | | 23 | `#8c8a86` | `oklch(63.36% 0.0067 88.89)` | Heavy Rain | black, 6 to 1 | | 24 | `#888682` | `oklch(61.99% 0.0061 76.37)` | Classic French Grey | black, 5.7 to 1 | | 25 | `#84817e` | `oklch(60.57% 0.0058 66.23)` | Grey Pepper | black, 5.4 to 1 | | 26 | `#807d7a` | `oklch(59.17% 0.0055 60.35)` | Friar Grey | black, 5.1 to 1 | | 27 | `#7c7876` | `oklch(57.57% 0.0056 58.58)` | Ocean Frigate | black, 4.8 to 1 | | 28 | `#777370` | `oklch(55.76% 0.0062 59.58)` | Rugged Suede | white, 4.7 to 1 | | 29 | `#716d6a` | `oklch(53.90% 0.0072 62.30)` | Homebush | white, 5 to 1 | | 30 | `#6d6864` | `oklch(52.15% 0.0082 65.74)` | Volcanic Rock | white, 5.4 to 1 | | 31 | `#696460` | `oklch(50.67% 0.0091 68.85)` | Wire Wool | white, 5.8 to 1 | | 32 | `#66615c` | `oklch(49.61% 0.0096 70.63)` | Gropius Grey | white, 6.1 to 1 | ## CSS ```css background: linear-gradient(90deg, #655839 0.0%, #675a3a 3.2%, #6a5d3a 6.5%, #6e613a 9.7%, #71653b 12.9%, #75693d 16.1%, #796e40 19.4%, #7c7344 22.6%, #80784a 25.8%, #857e51 29.0%, #898459 32.3%, #8d8960 35.5%, #908e67 38.7%, #91916e 41.9%, #919475 45.2%, #91967d 48.4%, #919783 51.6%, #919788 54.8%, #92968b 58.1%, #92958c 61.3%, #91928b 64.5%, #8f8e89 67.7%, #8c8a86 71.0%, #888682 74.2%, #84817e 77.4%, #807d7a 80.6%, #7c7876 83.9%, #777370 87.1%, #716d6a 90.3%, #6d6864 93.5%, #696460 96.8%, #66615c 100.0%); background: linear-gradient(90deg in oklch, oklch(46.46% 0.0482 86.48) 0.0%, oklch(47.21% 0.0504 87.61) 3.2%, oklch(48.22% 0.0538 89.19) 6.5%, oklch(49.43% 0.0577 91.04) 9.7%, oklch(50.78% 0.0614 93.03) 12.9%, oklch(52.20% 0.0644 94.98) 16.1%, oklch(53.65% 0.0660 96.74) 19.4%, oklch(55.18% 0.0661 98.18) 22.6%, oklch(56.94% 0.0652 99.38) 25.8%, oklch(58.81% 0.0635 100.48) 29.0%, oklch(60.66% 0.0610 101.64) 32.3%, oklch(62.34% 0.0578 103.00) 35.5%, oklch(63.73% 0.0540 104.70) 38.7%, oklch(64.75% 0.0495 107.21) 41.9%, oklch(65.58% 0.0434 111.45) 45.2%, oklch(66.20% 0.0364 116.47) 48.4%, oklch(66.61% 0.0291 121.13) 51.6%, oklch(66.79% 0.0222 124.30) 54.8%, oklch(66.71% 0.0164 124.86) 58.1%, oklch(66.35% 0.0124 121.58) 61.3%, oklch(65.63% 0.0096 113.41) 64.5%, oklch(64.61% 0.0078 101.88) 67.7%, oklch(63.36% 0.0067 88.89) 71.0%, oklch(61.99% 0.0061 76.37) 74.2%, oklch(60.57% 0.0058 66.23) 77.4%, oklch(59.17% 0.0055 60.35) 80.6%, oklch(57.57% 0.0056 58.58) 83.9%, oklch(55.76% 0.0062 59.58) 87.1%, oklch(53.90% 0.0072 62.30) 90.3%, oklch(52.15% 0.0082 65.74) 93.5%, oklch(50.67% 0.0091 68.85) 96.8%, oklch(49.61% 0.0096 70.63) 100.0%); ``` ## Keyframes 6 OKLCH keyframes joined by a Catmull-Rom spline. Hue is unwrapped degrees. | Keyframe | Lightness | Chroma | Hue | | --- | --- | --- | --- | | 1 | 0.465 | 0.048 | 86.5 | | 2 | 0.539 | 0.066 | 97.1 | | 3 | 0.642 | 0.052 | 105.5 | | 4 | 0.665 | 0.014 | 123.5 | | 5 | 0.594 | 0.006 | 61.1 | | 6 | 0.496 | 0.01 | 70.6 | ## In these collections - [Weathered garden gradients](https://grabient.com/weathered-garden-gradients) - [Soft neutral gradients](https://grabient.com/soft-neutral-gradients) - [Earth tone gradients](https://grabient.com/earth-tone-gradients) ## Other forms - [JSON](https://grabient.com/kYdiM9xJhBNGTQPUhUIS4I4j8DwQ.json?steps=32) - [PNG](https://grabient.com/kYdiM9xJhBNGTQPUhUIS4I4j8DwQ.png?steps=32) - [SVG](https://grabient.com/kYdiM9xJhBNGTQPUhUIS4I4j8DwQ.svg?steps=32) - [CSS](https://grabient.com/kYdiM9xJhBNGTQPUhUIS4I4j8DwQ.css?steps=32) - [ASE](https://grabient.com/kYdiM9xJhBNGTQPUhUIS4I4j8DwQ.ase?steps=32) - [GPL](https://grabient.com/kYdiM9xJhBNGTQPUhUIS4I4j8DwQ.gpl?steps=32) - [GRD](https://grabient.com/kYdiM9xJhBNGTQPUhUIS4I4j8DwQ.grd?steps=32) - [Design tokens](https://grabient.com/kYdiM9xJhBNGTQPUhUIS4I4j8DwQ.tokens.json?steps=32) - [Social card](https://grabient.com/api/og?seed=kYdiM9xJhBNGTQPUhUIS4I4j8DwQ&steps=32) - [Palettes like this one](https://grabient.com/palettes?q=kYdiM9xJhBNGTQPUhUIS4I4j8DwQ) - [Guide for agents](https://grabient.com/llms.txt)