# Seamless gray and brown radial swatches

Seamless gray and brown radial swatches with 32 colors: #e0d7c6, #dad1c0, #d3c9b7, #cabfac, #c0b4a0, #b6a893, #ab9b86, #a08e79, #95816c, #8a7560, #806a54, #78604a, #705742, #6a503b, #664c36, #644934, #644a34, #674c36, #6b523b, #725942, #79624a, #836c54, #8d7860, #97856c, #a39279, #aea087, #baad95, #c4baa2, #cfc5ae, #d8d0b9, #dfd8c2, #e5dfc9. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kS4BI8tpI8_KLRA`
- Page: https://grabient.com/kS4BI8tpI8_KLRA?style=radialSwatches&steps=32&angle=120
- Drawn as: radial swatches, 32 steps, 120 degrees
- Kinds: dark center, muted, warm, monochrome, seamless
- Hues: analogous
- Contrast of its darkest and lightest colors: 6.1 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 | `#e0d7c6` | `oklch(88.19% 0.0248 85.08)` | Bone | black, 14.7 to 1 |
| 2 | `#dad1c0` | `oklch(86.37% 0.0258 84.04)` | Clam | black, 13.8 to 1 |
| 3 | `#d3c9b7` | `oklch(83.89% 0.0271 82.61)` | Sandstone Cliff | black, 12.7 to 1 |
| 4 | `#cabfac` | `oklch(80.88% 0.0287 80.86)` | Sandbar | black, 11.5 to 1 |
| 5 | `#c0b4a0` | `oklch(77.44% 0.0305 78.85)` | Pigeon Grey | black, 10.2 to 1 |
| 6 | `#b6a893` | `oklch(73.67% 0.0325 76.65)` | Humus | black, 8.9 to 1 |
| 7 | `#ab9b86` | `oklch(69.71% 0.0346 74.34)` | Land of Nod | black, 7.7 to 1 |
| 8 | `#a08e79` | `oklch(65.64% 0.0368 71.98)` | Cottage Walk | black, 6.6 to 1 |
| 9 | `#95816c` | `oklch(61.59% 0.0389 69.64)` | Sofisticata | black, 5.6 to 1 |
| 10 | `#8a7560` | `oklch(57.67% 0.0411 67.39)` | Mink | black, 4.8 to 1 |
| 11 | `#806a54` | `oklch(53.99% 0.0431 65.30)` | Salted Pretzel | white, 5.1 to 1 |
| 12 | `#78604a` | `oklch(50.65% 0.0449 63.43)` | Hickory Nut | white, 5.8 to 1 |
| 13 | `#705742` | `oklch(47.77% 0.0465 61.87)` | Cinnamon Crumble | white, 6.6 to 1 |
| 14 | `#6a503b` | `oklch(45.46% 0.0478 60.67)` | Coffee Liqueur | white, 7.3 to 1 |
| 15 | `#664c36` | `oklch(43.83% 0.0488 59.90)` | Black Power | white, 7.9 to 1 |
| 16 | `#644934` | `oklch(43.00% 0.0495 59.64)` | Buckeye | white, 8.2 to 1 |
| 17 | `#644a34` | `oklch(43.06% 0.0496 59.95)` | Black Power | white, 8.1 to 1 |
| 18 | `#674c36` | `oklch(44.03% 0.0494 60.86)` | Black Power | white, 7.8 to 1 |
| 19 | `#6b523b` | `oklch(45.80% 0.0488 62.30)` | Coffee Liqueur | white, 7.2 to 1 |
| 20 | `#725942` | `oklch(48.25% 0.0479 64.20)` | Alpha Male | white, 6.5 to 1 |
| 21 | `#79624a` | `oklch(51.28% 0.0467 66.48)` | Fig Branches | white, 5.7 to 1 |
| 22 | `#836c54` | `oklch(54.76% 0.0452 69.06)` | Salted Pretzel | white, 4.9 to 1 |
| 23 | `#8d7860` | `oklch(58.60% 0.0436 71.86)` | Hat Box Brown | black, 4.9 to 1 |
| 24 | `#97856c` | `oklch(62.67% 0.0419 74.82)` | Wild Hawk | black, 5.8 to 1 |
| 25 | `#a39279` | `oklch(66.86% 0.0402 77.84)` | Mountain Hideaway | black, 6.9 to 1 |
| 26 | `#aea087` | `oklch(71.06% 0.0384 80.86)` | Sandy Bluff | black, 8.1 to 1 |
| 27 | `#baad95` | `oklch(75.15% 0.0367 83.80)` | Nile Sand | black, 9.4 to 1 |
| 28 | `#c4baa2` | `oklch(79.04% 0.0350 86.58)` | Dancing Dolphin | black, 10.8 to 1 |
| 29 | `#cfc5ae` | `oklch(82.59% 0.0335 89.12)` | Yuma Sand | black, 12.2 to 1 |
| 30 | `#d8d0b9` | `oklch(85.70% 0.0322 91.36)` | Bleached Pebble | black, 13.6 to 1 |
| 31 | `#dfd8c2` | `oklch(88.26% 0.0311 93.21)` | Palm Heart Cream | black, 14.7 to 1 |
| 32 | `#e5dfc9` | `oklch(90.16% 0.0303 94.59)` | Light Beige | black, 15.6 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #e0d7c6 0.000% 3.125%, #dad1c0 3.125% 6.250%, #d3c9b7 6.250% 9.375%, #cabfac 9.375% 12.500%, #c0b4a0 12.500% 15.625%, #b6a893 15.625% 18.750%, #ab9b86 18.750% 21.875%, #a08e79 21.875% 25.000%, #95816c 25.000% 28.125%, #8a7560 28.125% 31.250%, #806a54 31.250% 34.375%, #78604a 34.375% 37.500%, #705742 37.500% 40.625%, #6a503b 40.625% 43.750%, #664c36 43.750% 46.875%, #644934 46.875% 50.000%, #644a34 50.000% 53.125%, #674c36 53.125% 56.250%, #6b523b 56.250% 59.375%, #725942 59.375% 62.500%, #79624a 62.500% 65.625%, #836c54 65.625% 68.750%, #8d7860 68.750% 71.875%, #97856c 71.875% 75.000%, #a39279 75.000% 78.125%, #aea087 78.125% 81.250%, #baad95 81.250% 84.375%, #c4baa2 84.375% 87.500%, #cfc5ae 87.500% 90.625%, #d8d0b9 90.625% 93.750%, #dfd8c2 93.750% 96.875%, #e5dfc9 96.875% 100.000%);
background: radial-gradient(circle at 50% 50%, oklch(88.19% 0.0248 85.08) 0.000% 3.125%, oklch(86.37% 0.0258 84.04) 3.125% 6.250%, oklch(83.89% 0.0271 82.61) 6.250% 9.375%, oklch(80.88% 0.0287 80.86) 9.375% 12.500%, oklch(77.44% 0.0305 78.85) 12.500% 15.625%, oklch(73.67% 0.0325 76.65) 15.625% 18.750%, oklch(69.71% 0.0346 74.34) 18.750% 21.875%, oklch(65.64% 0.0368 71.98) 21.875% 25.000%, oklch(61.59% 0.0389 69.64) 25.000% 28.125%, oklch(57.67% 0.0411 67.39) 28.125% 31.250%, oklch(53.99% 0.0431 65.30) 31.250% 34.375%, oklch(50.65% 0.0449 63.43) 34.375% 37.500%, oklch(47.77% 0.0465 61.87) 37.500% 40.625%, oklch(45.46% 0.0478 60.67) 40.625% 43.750%, oklch(43.83% 0.0488 59.90) 43.750% 46.875%, oklch(43.00% 0.0495 59.64) 46.875% 50.000%, oklch(43.06% 0.0496 59.95) 50.000% 53.125%, oklch(44.03% 0.0494 60.86) 53.125% 56.250%, oklch(45.80% 0.0488 62.30) 56.250% 59.375%, oklch(48.25% 0.0479 64.20) 59.375% 62.500%, oklch(51.28% 0.0467 66.48) 62.500% 65.625%, oklch(54.76% 0.0452 69.06) 65.625% 68.750%, oklch(58.60% 0.0436 71.86) 68.750% 71.875%, oklch(62.67% 0.0419 74.82) 71.875% 75.000%, oklch(66.86% 0.0402 77.84) 75.000% 78.125%, oklch(71.06% 0.0384 80.86) 78.125% 81.250%, oklch(75.15% 0.0367 83.80) 81.250% 84.375%, oklch(79.04% 0.0350 86.58) 84.375% 87.500%, oklch(82.59% 0.0335 89.12) 87.500% 90.625%, oklch(85.70% 0.0322 91.36) 90.625% 93.750%, oklch(88.26% 0.0311 93.21) 93.750% 96.875%, oklch(90.16% 0.0303 94.59) 96.875% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.882 | 0.025 | 85.1 |
| 2 | 0.429 | 0.05 | 59.7 |
| 3 | 0.902 | 0.03 | 94.6 |

## In these collections

- [Soft neutral gradients](https://grabient.com/soft-neutral-gradients)
- [Warm neutral gradients](https://grabient.com/warm-neutral-gradients)
- [Muted gradients](https://grabient.com/muted-gradients)

## Other forms

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