# Tritone green, brown and purple angular swatches

Tritone green, brown and purple angular swatches with 21 colors: #a5c65a, #abc353, #b2bf4a, #bbba41, #c2b338, #c7ac32, #c9a530, #c99d31, #c89534, #c68c37, #c3833c, #c07843, #ba6e4c, #b36455, #a95b5c, #9d5362, #904a65, #804167, #703868, #623168, #572d67. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kWxmZYXzI8tQqvFEJDksCa5o`
- Page: https://grabient.com/kWxmZYXzI8tQqvFEJDksCa5o?style=angularSwatches&steps=21&angle=0
- Drawn as: angular swatches, 21 steps, 0 degrees
- Kinds: light to dark, vivid, warm, multicolor
- Hues: wide
- Contrast of its darkest and lightest colors: 5.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 | `#a5c65a` | `oklch(77.95% 0.1406 123.75)` | Spring Lime | black, 10.8 to 1 |
| 2 | `#abc353` | `oklch(77.61% 0.1405 120.06)` | Green Glow | black, 10.6 to 1 |
| 3 | `#b2bf4a` | `oklch(77.18% 0.1405 114.89)` | Celery | black, 10.4 to 1 |
| 4 | `#bbba41` | `oklch(76.61% 0.1403 108.81)` | Sinsemilla | black, 10.1 to 1 |
| 5 | `#c2b338` | `oklch(75.84% 0.1395 102.41)` | Mulgore Mustard | black, 9.8 to 1 |
| 6 | `#c7ac32` | `oklch(74.80% 0.1378 96.27)` | Hippie Trail | black, 9.4 to 1 |
| 7 | `#c9a530` | `oklch(73.49% 0.1348 90.77)` | Aru Ressha | black, 8.9 to 1 |
| 8 | `#c99d31` | `oklch(71.92% 0.1307 85.51)` | Local Curry | black, 8.3 to 1 |
| 9 | `#c89534` | `oklch(70.15% 0.1261 79.94)` | Alameda Ochre | black, 7.7 to 1 |
| 10 | `#c68c37` | `oklch(68.21% 0.1214 73.50)` | Child of the Moon | black, 7.2 to 1 |
| 11 | `#c3833c` | `oklch(66.14% 0.1171 65.63)` | Fancy Suede | black, 6.6 to 1 |
| 12 | `#c07843` | `oklch(63.92% 0.1130 55.84)` | Marmalade Glaze | black, 6 to 1 |
| 13 | `#ba6e4c` | `oklch(61.54% 0.1086 44.50)` | Adobe | black, 5.4 to 1 |
| 14 | `#b36455` | `oklch(59.00% 0.1045 32.35)` | Chimayo Red | black, 4.8 to 1 |
| 15 | `#a95b5c` | `oklch(56.33% 0.1012 20.13)` | Tuscan Clay | white, 4.8 to 1 |
| 16 | `#9d5362` | `oklch(53.54% 0.0992 8.56)` | Mission Wildflower | white, 5.4 to 1 |
| 17 | `#904a65` | `oklch(50.34% 0.0991 356.88)` | Glitterati | white, 6.2 to 1 |
| 18 | `#804167` | `oklch(46.71% 0.1005 344.59)` | Vivacious Violet | white, 7.3 to 1 |
| 19 | `#703868` | `oklch(43.11% 0.1027 332.85)` | Ayame Iris | white, 8.5 to 1 |
| 20 | `#623168` | `oklch(39.99% 0.1048 322.84)` | Imperial | white, 9.7 to 1 |
| 21 | `#572d67` | `oklch(37.80% 0.1061 315.73)` | Imperial Purple | white, 10.6 to 1 |

## CSS

```css
background: conic-gradient(from 0deg, #a5c65a 0.000% 4.762%, #abc353 4.762% 9.524%, #b2bf4a 9.524% 14.286%, #bbba41 14.286% 19.048%, #c2b338 19.048% 23.810%, #c7ac32 23.810% 28.571%, #c9a530 28.571% 33.333%, #c99d31 33.333% 38.095%, #c89534 38.095% 42.857%, #c68c37 42.857% 47.619%, #c3833c 47.619% 52.381%, #c07843 52.381% 57.143%, #ba6e4c 57.143% 61.905%, #b36455 61.905% 66.667%, #a95b5c 66.667% 71.429%, #9d5362 71.429% 76.190%, #904a65 76.190% 80.952%, #804167 80.952% 85.714%, #703868 85.714% 90.476%, #623168 90.476% 95.238%, #572d67 95.238% 100.000%);
background: conic-gradient(from 0deg, oklch(77.95% 0.1406 123.75) 0.000% 4.762%, oklch(77.61% 0.1405 120.06) 4.762% 9.524%, oklch(77.18% 0.1405 114.89) 9.524% 14.286%, oklch(76.61% 0.1403 108.81) 14.286% 19.048%, oklch(75.84% 0.1395 102.41) 19.048% 23.810%, oklch(74.80% 0.1378 96.27) 23.810% 28.571%, oklch(73.49% 0.1348 90.77) 28.571% 33.333%, oklch(71.92% 0.1307 85.51) 33.333% 38.095%, oklch(70.15% 0.1261 79.94) 38.095% 42.857%, oklch(68.21% 0.1214 73.50) 42.857% 47.619%, oklch(66.14% 0.1171 65.63) 47.619% 52.381%, oklch(63.92% 0.1130 55.84) 52.381% 57.143%, oklch(61.54% 0.1086 44.50) 57.143% 61.905%, oklch(59.00% 0.1045 32.35) 61.905% 66.667%, oklch(56.33% 0.1012 20.13) 66.667% 71.429%, oklch(53.54% 0.0992 8.56) 71.429% 76.190%, oklch(50.34% 0.0991 356.88) 76.190% 80.952%, oklch(46.71% 0.1005 344.59) 80.952% 85.714%, oklch(43.11% 0.1027 332.85) 85.714% 90.476%, oklch(39.99% 0.1048 322.84) 90.476% 95.238%, oklch(37.80% 0.1061 315.73) 95.238% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.78 | 0.141 | 123.8 |
| 2 | 0.748 | 0.138 | 96.3 |
| 3 | 0.661 | 0.117 | 65.6 |
| 4 | 0.535 | 0.099 | 8.6 |
| 5 | 0.378 | 0.106 | -44.3 |

## In these collections

- [Harvest gradients](https://grabient.com/harvest-gradients)

## Other forms

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