# Indigo, ochre and mauve color palette

The Indigo, ochre and mauve color palette brings together blue, gray, yellow, light yellow, light gray, and teal. The colors span a narrow lightness range, combining moderate color with gentle contrast. Its balanced and composed character suits botanical branding and garden event graphics. Its darkest tone is blue, and its lightest tone is light yellow.

- Also called: Complementary purple, gray and tan linear gradient
- Seed: `kclEfMxJ--scINFTIjd3yW_eOSv5eB8qUhJBY`
- Page: https://grabient.com/kclEfMxJ--scINFTIjd3yW_eOSv5eB8qUhJBY?steps=21&angle=270
- Drawn as: linear gradient, 21 steps, 270 degrees
- Kinds: muted
- Hues: multi-hue
- Contrast of its darkest and lightest colors: 2.6 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 | `#7871b2` | `oklch(58.27% 0.0978 287.58)` | Plum Preserve | black, 4.8 to 1 |
| 2 | `#746dad` | `oklch(56.82% 0.0969 288.15)` | Clear Mauve | white, 4.6 to 1 |
| 3 | `#6e68a6` | `oklch(54.91% 0.0944 286.96)` | Inner Journey | white, 5 to 1 |
| 4 | `#5f6aa0` | `oklch(53.88% 0.0846 274.04)` | Twinkle Night | white, 5.1 to 1 |
| 5 | `#50738e` | `oklch(53.91% 0.0582 242.75)` | Metallic Blue | white, 5 to 1 |
| 6 | `#5d7679` | `oklch(54.74% 0.0299 203.50)` | Paradise City | white, 4.8 to 1 |
| 7 | `#697b74` | `oklch(56.55% 0.0240 170.17)` | Cypress Garden | black, 4.6 to 1 |
| 8 | `#70876c` | `oklch(59.65% 0.0485 140.83)` | Thyme and Place | black, 5.3 to 1 |
| 9 | `#879156` | `oklch(63.34% 0.0812 116.49)` | Vintage Vibe | black, 6.1 to 1 |
| 10 | `#a0974a` | `oklch(66.83% 0.0991 102.56)` | Lentil Sprout | black, 7 to 1 |
| 11 | `#afa14e` | `oklch(70.45% 0.1063 100.47)` | Queen Palm | black, 8 to 1 |
| 12 | `#b6ad59` | `oklch(73.71% 0.1059 102.58)` | Gimblet | black, 9 to 1 |
| 13 | `#bfb369` | `oklch(76.02% 0.0965 100.46)` | Golden Green | black, 9.8 to 1 |
| 14 | `#c6b67e` | `oklch(77.62% 0.0765 94.51)` | Aviva | black, 10.3 to 1 |
| 15 | `#c3b991` | `oklch(78.34% 0.0556 96.02)` | Salty Seeds | black, 10.6 to 1 |
| 16 | `#b5bb9e` | `oklch(77.94% 0.0405 117.20)` | Dried Chervil | black, 10.5 to 1 |
| 17 | `#a6b8ab` | `oklch(76.49% 0.0275 154.46)` | Silt Green | black, 10 to 1 |
| 18 | `#9eb0ae` | `oklch(74.36% 0.0208 186.44)` | Veranda Charm | black, 9.3 to 1 |
| 19 | `#90a8a8` | `oklch(71.26% 0.0259 199.17)` | In the Deep End | black, 8.3 to 1 |
| 20 | `#7a9ea1` | `oklch(67.38% 0.0393 201.55)` | Gould Blue | black, 7.2 to 1 |
| 21 | `#6a979b` | `oklch(64.57% 0.0496 201.98)` | Baltic Blue | black, 6.5 to 1 |

## CSS

```css
background: linear-gradient(270deg, #7871b2 0.0%, #746dad 5.0%, #6e68a6 10.0%, #5f6aa0 15.0%, #50738e 20.0%, #5d7679 25.0%, #697b74 30.0%, #70876c 35.0%, #879156 40.0%, #a0974a 45.0%, #afa14e 50.0%, #b6ad59 55.0%, #bfb369 60.0%, #c6b67e 65.0%, #c3b991 70.0%, #b5bb9e 75.0%, #a6b8ab 80.0%, #9eb0ae 85.0%, #90a8a8 90.0%, #7a9ea1 95.0%, #6a979b 100.0%);
background: linear-gradient(270deg in oklch, oklch(58.27% 0.0978 287.58) 0.0%, oklch(56.82% 0.0969 288.15) 5.0%, oklch(54.91% 0.0944 286.96) 10.0%, oklch(53.88% 0.0846 274.04) 15.0%, oklch(53.91% 0.0582 242.75) 20.0%, oklch(54.74% 0.0299 203.50) 25.0%, oklch(56.55% 0.0240 170.17) 30.0%, oklch(59.65% 0.0485 140.83) 35.0%, oklch(63.34% 0.0812 116.49) 40.0%, oklch(66.83% 0.0991 102.56) 45.0%, oklch(70.45% 0.1063 100.47) 50.0%, oklch(73.71% 0.1059 102.58) 55.0%, oklch(76.02% 0.0965 100.46) 60.0%, oklch(77.62% 0.0765 94.51) 65.0%, oklch(78.34% 0.0556 96.02) 70.0%, oklch(77.94% 0.0405 117.20) 75.0%, oklch(76.49% 0.0275 154.46) 80.0%, oklch(74.36% 0.0208 186.44) 85.0%, oklch(71.26% 0.0259 199.17) 90.0%, oklch(67.38% 0.0393 201.55) 95.0%, oklch(64.57% 0.0496 201.98) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.583 | 0.098 | 287.6 |
| 2 | 0.539 | 0.087 | 277 |
| 3 | 0.559 | 0.022 | 178.7 |
| 4 | 0.654 | 0.094 | 106.9 |
| 5 | 0.748 | 0.103 | 102.6 |
| 6 | 0.783 | 0.051 | 99.5 |
| 7 | 0.74 | 0.021 | 189.3 |
| 8 | 0.646 | 0.05 | 202 |

## In these collections

- [Weathered garden gradients](https://grabient.com/weathered-garden-gradients)
- [Soft multicolor gradients](https://grabient.com/soft-multicolor-gradients)

## Other forms

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