# Charcoal, tan and gray hydrangea ribbon boutonniere

The Charcoal, tan and gray hydrangea ribbon boutonniere brings together gray, green, light orange, light red, and purple. The colors span a broad lightness range, combining restrained color with clear contrast. Its balanced and composed character suits brand mood boards and editorial graphics. Its darkest tone is gray, and its lightest tone is light orange.

- Also called: Dark gray and gray linear swatches
- Seed: `kYWQltwIs_NqOPFnjLwX4m4ckOuK`
- Page: https://grabient.com/kYWQltwIs_NqOPFnjLwX4m4ckOuK?style=linearSwatches&steps=6&angle=270
- Drawn as: linear swatches, 6 steps, 270 degrees
- Kinds: light center, neutral
- Hues: split-complementary
- Contrast of its darkest and lightest colors: 6.3 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 | `#363d38` | `oklch(35.04% 0.0124 153.98)` | Black Olive | white, 11.2 to 1 |
| 2 | `#5a6a5c` | `oklch(50.79% 0.0303 147.64)` | Less Traveled | white, 5.7 to 1 |
| 3 | `#a0a68b` | `oklch(71.26% 0.0386 117.00)` | Solid Snake | black, 8.3 to 1 |
| 4 | `#cdc1aa` | `oklch(81.50% 0.0344 84.24)` | Ancient Relic | black, 11.8 to 1 |
| 5 | `#bfa8a7` | `oklch(75.20% 0.0262 20.83)` | Relaxed Rhino | black, 9.4 to 1 |
| 6 | `#837288` | `oklch(57.48% 0.0400 319.54)` | Hyacinth Dream | black, 4.7 to 1 |

## CSS

```css
background: linear-gradient(270deg, #363d38 0.000% 16.667%, #5a6a5c 16.667% 33.333%, #a0a68b 33.333% 50.000%, #cdc1aa 50.000% 66.667%, #bfa8a7 66.667% 83.333%, #837288 83.333% 100.000%);
background: linear-gradient(270deg, oklch(35.04% 0.0124 153.98) 0.000% 16.667%, oklch(50.79% 0.0303 147.64) 16.667% 33.333%, oklch(71.26% 0.0386 117.00) 33.333% 50.000%, oklch(81.50% 0.0344 84.24) 50.000% 66.667%, oklch(75.20% 0.0262 20.83) 66.667% 83.333%, oklch(57.48% 0.0400 319.54) 83.333% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.35 | 0.012 | 154 |
| 2 | 0.508 | 0.03 | 147.6 |
| 3 | 0.713 | 0.039 | 117 |
| 4 | 0.815 | 0.034 | 84.2 |
| 5 | 0.752 | 0.026 | 20.8 |
| 6 | 0.575 | 0.04 | -40.5 |

## In these collections

- [Hydrangea ribbon boutonniere](https://grabient.com/hydrangea-ribbon-boutonniere)

## Other forms

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