# Tritone brown, purple and blue angular gradient

Tritone brown, purple and blue angular gradient with 6 colors: #938141, #7c4c66, #37329b, #0241cc, #126ffa, #23b2ff. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kYmj9DPRszLI7t85UD4ydC_ly6PY`
- Page: https://grabient.com/kYmj9DPRszLI7t85UD4ydC_ly6PY?style=angularGradient&steps=6&angle=180
- Drawn as: angular gradient, 6 steps, 180 degrees
- Kinds: dark center, vivid
- Hues: analogous
- Contrast of its darkest and lightest colors: 4.2 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 | `#938141` | `oklch(60.63% 0.0868 94.22)` | Lucky Bamboo | black, 5.4 to 1 |
| 2 | `#7c4c66` | `oklch(48.03% 0.0744 346.43)` | Nectar Red | white, 6.8 to 1 |
| 3 | `#37329b` | `oklch(39.37% 0.1640 277.74)` | Bluebell | white, 10 to 1 |
| 4 | `#0241cc` | `oklch(44.88% 0.2205 262.95)` | Blue Blue | white, 7.9 to 1 |
| 5 | `#126ffa` | `oklch(57.87% 0.2219 259.78)` | Brandeis Blue | black, 4.6 to 1 |
| 6 | `#23b2ff` | `oklch(72.83% 0.1578 239.69)` | Fantasy Console Sky | black, 8.8 to 1 |

## CSS

```css
background: conic-gradient(from 180deg, #938141 0.0%, #7c4c66 20.0%, #37329b 40.0%, #0241cc 60.0%, #126ffa 80.0%, #23b2ff 100.0%);
background: conic-gradient(from 180deg in oklch, oklch(60.63% 0.0868 94.22) 0.0%, oklch(48.03% 0.0744 346.43) 20.0%, oklch(39.37% 0.1640 277.74) 40.0%, oklch(44.88% 0.2205 262.95) 60.0%, oklch(57.87% 0.2219 259.78) 80.0%, oklch(72.83% 0.1578 239.69) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.606 | 0.087 | 94.2 |
| 2 | 0.48 | 0.074 | -13.6 |
| 3 | 0.394 | 0.164 | -82.3 |
| 4 | 0.449 | 0.22 | -97.1 |
| 5 | 0.579 | 0.222 | -100.2 |
| 6 | 0.728 | 0.16 | -120.3 |

## In these collections

- [Multicolor gradients](https://grabient.com/multicolor-gradients)

## Other forms

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