# Triadic pink, blue, gray and dark green linear swatches

Triadic pink, blue, gray and dark green linear swatches with 14 colors: #ffdbe8, #ffcff1, #eac8ff, #c9c1ff, #a8b5f0, #8fa2c6, #7f8c9e, #6d7888, #576581, #4b507c, #54396b, #632336, #4b2c00, #2d3200. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kW60n8aSS30yJvG0H0TpqTU4`
- Page: https://grabient.com/kW60n8aSS30yJvG0H0TpqTU4?style=linearSwatches&steps=14&angle=99
- Drawn as: linear swatches, 14 steps, 99 degrees
- Kinds: light to dark, multicolor
- Hues: wide
- Contrast of its darkest and lightest colors: 10.5 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 | `#ffdbe8` | `oklch(92.52% 0.0430 354.37)` | Strawberry Cheesecake | black, 16.5 to 1 |
| 2 | `#ffcff1` | `oklch(90.63% 0.0688 337.02)` | Shampoo | black, 15.4 to 1 |
| 3 | `#eac8ff` | `oklch(87.83% 0.0832 312.39)` | Aquarelle Lilac | black, 14.1 to 1 |
| 4 | `#c9c1ff` | `oklch(83.87% 0.0859 289.88)` | Lavender Tonic | black, 12.5 to 1 |
| 5 | `#a8b5f0` | `oklch(78.29% 0.0858 274.72)` | Wondrous Wisteria | black, 10.4 to 1 |
| 6 | `#8fa2c6` | `oklch(71.11% 0.0558 262.70)` | Wild Clary | black, 8.1 to 1 |
| 7 | `#7f8c9e` | `oklch(63.64% 0.0310 256.30)` | Lucid Blue | black, 6.1 to 1 |
| 8 | `#6d7888` | `oklch(57.01% 0.0284 257.29)` | Ice Blue Grey | black, 4.7 to 1 |
| 9 | `#576581` | `oklch(50.63% 0.0471 263.04)` | Stained Glass | white, 5.8 to 1 |
| 10 | `#4b507c` | `oklch(44.74% 0.0720 277.91)` | Provocative | white, 7.6 to 1 |
| 11 | `#54396b` | `oklch(39.81% 0.0881 308.08)` | Succinct Violet | white, 9.6 to 1 |
| 12 | `#632336` | `oklch(35.74% 0.0952 4.88)` | Wine Country | white, 11.5 to 1 |
| 13 | `#4b2c00` | `oklch(32.52% 0.0705 69.77)` | Stirland Mud | white, 12.6 to 1 |
| 14 | `#2d3200` | `oklch(30.32% 0.0692 115.92)` | Wasabi Nori | white, 13.3 to 1 |

## CSS

```css
background: linear-gradient(99deg, #ffdbe8 0.000% 7.143%, #ffcff1 7.143% 14.286%, #eac8ff 14.286% 21.429%, #c9c1ff 21.429% 28.571%, #a8b5f0 28.571% 35.714%, #8fa2c6 35.714% 42.857%, #7f8c9e 42.857% 50.000%, #6d7888 50.000% 57.143%, #576581 57.143% 64.286%, #4b507c 64.286% 71.429%, #54396b 71.429% 78.571%, #632336 78.571% 85.714%, #4b2c00 85.714% 92.857%, #2d3200 92.857% 100.000%);
background: linear-gradient(99deg, oklch(92.52% 0.0430 354.37) 0.000% 7.143%, oklch(90.63% 0.0688 337.02) 7.143% 14.286%, oklch(87.83% 0.0832 312.39) 14.286% 21.429%, oklch(83.87% 0.0859 289.88) 21.429% 28.571%, oklch(78.29% 0.0858 274.72) 28.571% 35.714%, oklch(71.11% 0.0558 262.70) 35.714% 42.857%, oklch(63.64% 0.0310 256.30) 42.857% 50.000%, oklch(57.01% 0.0284 257.29) 50.000% 57.143%, oklch(50.63% 0.0471 263.04) 57.143% 64.286%, oklch(44.74% 0.0720 277.91) 64.286% 71.429%, oklch(39.81% 0.0881 308.08) 71.429% 78.571%, oklch(35.74% 0.0952 4.88) 78.571% 85.714%, oklch(32.52% 0.0705 69.77) 85.714% 92.857%, oklch(30.32% 0.0692 115.92) 92.857% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.925 | 0.101 | 354.4 |
| 2 | 0.827 | 0.101 | 285.7 |
| 3 | 0.602 | 0.026 | 256.1 |
| 4 | 0.409 | 0.085 | 298.4 |
| 5 | 0.303 | 0.101 | 475.9 |

## In these collections

- [Dusk swatches](https://grabient.com/dusk-swatches)

## Other forms

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