# Ochre Pale Amber Clay Brown

These angular swatch wedges move through ochre, pale amber, clay brown, warm sand, and dark earth brown in its saved order. The complete composition keeps the lighter and darker areas distinct while preserving a balanced route through the named palette.

- Also called: Analogous orange, tan and brown angular swatches
- Seed: `kWpV0r6aRCj4hu9dqEHKZI8o`
- Page: https://grabient.com/kWpV0r6aRCj4hu9dqEHKZI8o?style=angularSwatches&steps=5&angle=45
- Drawn as: angular swatches, 5 steps, 45 degrees
- Kinds: warm, monochrome
- Hues: analogous
- Contrast of its darkest and lightest colors: 7.4 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 | `#c67b30` | `oklch(64.96% 0.1281 61.17)` | Exotic Honey | black, 6.2 to 1 |
| 2 | `#e7c27b` | `oklch(83.07% 0.0992 83.36)` | Celebration | black, 12.4 to 1 |
| 3 | `#8a4e2e` | `oklch(48.82% 0.0923 48.49)` | Chestnut Glaze | white, 6.5 to 1 |
| 4 | `#da9a5b` | `oklch(73.62% 0.1102 64.34)` | Stunning Gold | black, 8.7 to 1 |
| 5 | `#4b2b22` | `oklch(32.68% 0.0496 36.87)` | Couch | white, 12.6 to 1 |

## CSS

```css
background: conic-gradient(from 45deg, #c67b30 0.000% 20.000%, #e7c27b 20.000% 40.000%, #8a4e2e 40.000% 60.000%, #da9a5b 60.000% 80.000%, #4b2b22 80.000% 100.000%);
background: conic-gradient(from 45deg, oklch(64.96% 0.1281 61.17) 0.000% 20.000%, oklch(83.07% 0.0992 83.36) 20.000% 40.000%, oklch(48.82% 0.0923 48.49) 40.000% 60.000%, oklch(73.62% 0.1102 64.34) 60.000% 80.000%, oklch(32.68% 0.0496 36.87) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.65 | 0.128 | 61.2 |
| 2 | 0.831 | 0.099 | 83.4 |
| 3 | 0.488 | 0.092 | 48.5 |
| 4 | 0.736 | 0.11 | 64.3 |
| 5 | 0.327 | 0.05 | 36.9 |

## In these collections

- [Desert swatches](https://grabient.com/desert-swatches)

## Other forms

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