# Wine, mauve and deep cyan color palette

The Wine, mauve and deep cyan color palette brings together magenta, red, and teal. The colors span a moderate lightness range, combining moderate color with gentle contrast. Its balanced and composed character suits website sections and interface mockups. Its darkest tone is magenta, and its lightest tone is red.

- Also called: Complementary purple, pink and teal linear gradient
- Seed: `kcTT_6sqnA7-xwDHrz_PhK9jyOMZBHj2NxnAo`
- Page: https://grabient.com/kcTT_6sqnA7-xwDHrz_PhK9jyOMZBHj2NxnAo?steps=32
- Drawn as: linear gradient, 32 steps, 90 degrees
- Hues: complementary
- Contrast of its darkest and lightest colors: 2.8 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 | `#4d1833` | `oklch(30.31% 0.0868 352.27)` | Chilli Black Red | white, 14 to 1 |
| 2 | `#541a36` | `oklch(31.79% 0.0913 353.73)` | Tulip Poplar Purple | white, 13.3 to 1 |
| 3 | `#5c1d39` | `oklch(33.90% 0.0977 355.86)` | Soul Anchor | white, 12.3 to 1 |
| 4 | `#67213e` | `oklch(36.32% 0.1049 358.16)` | Pompadour | white, 11.3 to 1 |
| 5 | `#712442` | `oklch(38.78% 0.1118 0.12)` | Palace Red | white, 10.2 to 1 |
| 6 | `#7b2846` | `oklch(41.07% 0.1177 1.33)` | Red Plum | white, 9.3 to 1 |
| 7 | `#852d4c` | `oklch(43.50% 0.1238 2.07)` | Anemone | white, 8.5 to 1 |
| 8 | `#8f3151` | `oklch(45.95% 0.1295 2.49)` | That’s My Jam | white, 7.6 to 1 |
| 9 | `#983657` | `oklch(48.25% 0.1341 2.72)` | Cardinal Red | white, 6.9 to 1 |
| 10 | `#a03b5d` | `oklch(50.27% 0.1367 2.86)` | Boysenberry Pink | white, 6.4 to 1 |
| 11 | `#a74061` | `oklch(52.25% 0.1385 3.26)` | Rouge Like | white, 5.8 to 1 |
| 12 | `#ae4666` | `oklch(54.13% 0.1393 3.68)` | Sangria | white, 5.4 to 1 |
| 13 | `#b24b6b` | `oklch(55.60% 0.1376 3.57)` | Lickedy Lick | white, 5.1 to 1 |
| 14 | `#b24f6f` | `oklch(56.29% 0.1321 2.39)` | Diva Glam | white, 4.9 to 1 |
| 15 | `#ab5270` | `oklch(55.81% 0.1202 0.72)` | China Rose | white, 5 to 1 |
| 16 | `#9e546c` | `oklch(54.12% 0.1013 0.05)` | Mulberry Mix | white, 5.3 to 1 |
| 17 | `#8e5569` | `oklch(51.89% 0.0799 357.72)` | Pink Peppercorn | white, 5.7 to 1 |
| 18 | `#7e5467` | `oklch(49.82% 0.0607 350.90)` | Passive Royal | white, 6.2 to 1 |
| 19 | `#715569` | `oklch(48.56% 0.0482 336.52)` | Dark Purple Grey | white, 6.5 to 1 |
| 20 | `#65576f` | `oklch(47.87% 0.0409 310.80)` | Rich Texture | white, 6.6 to 1 |
| 21 | `#575a71` | `oklch(47.52% 0.0369 278.57)` | Nightshadow Blue | white, 6.7 to 1 |
| 22 | `#4c5e70` | `oklch(47.45% 0.0361 246.83)` | Ragtime Blues | white, 6.6 to 1 |
| 23 | `#45626c` | `oklch(47.60% 0.0381 222.61)` | Tempe Star | white, 6.5 to 1 |
| 24 | `#3f656c` | `oklch(48.20% 0.0444 209.50)` | Smock Blue | white, 6.3 to 1 |
| 25 | `#376b70` | `oklch(49.37% 0.0560 203.23)` | Aquarium | white, 6 to 1 |
| 26 | `#2b7175` | `oklch(50.58% 0.0689 201.15)` | Whaling Waters | white, 5.6 to 1 |
| 27 | `#1b7479` | `oklch(51.25% 0.0793 200.66)` | Poseidon’s Castle | white, 5.4 to 1 |
| 28 | `#0d7478` | `oklch(50.84% 0.0837 199.69)` | Maxi Teal | white, 5.5 to 1 |
| 29 | `#056f74` | `oklch(49.21% 0.0824 200.41)` | Active Turquoise | white, 5.9 to 1 |
| 30 | `#07676e` | `oklch(46.97% 0.0782 202.52)` | Trouser Blue | white, 6.5 to 1 |
| 31 | `#0b6068` | `oklch(44.78% 0.0734 204.91)` | Turkish Aqua | white, 7.2 to 1 |
| 32 | `#0d5b64` | `oklch(43.31% 0.0703 206.43)` | Enamelled Jewel | white, 7.7 to 1 |

## CSS

```css
background: linear-gradient(90deg, #4d1833 0.0%, #541a36 3.2%, #5c1d39 6.5%, #67213e 9.7%, #712442 12.9%, #7b2846 16.1%, #852d4c 19.4%, #8f3151 22.6%, #983657 25.8%, #a03b5d 29.0%, #a74061 32.3%, #ae4666 35.5%, #b24b6b 38.7%, #b24f6f 41.9%, #ab5270 45.2%, #9e546c 48.4%, #8e5569 51.6%, #7e5467 54.8%, #715569 58.1%, #65576f 61.3%, #575a71 64.5%, #4c5e70 67.7%, #45626c 71.0%, #3f656c 74.2%, #376b70 77.4%, #2b7175 80.6%, #1b7479 83.9%, #0d7478 87.1%, #056f74 90.3%, #07676e 93.5%, #0b6068 96.8%, #0d5b64 100.0%);
background: linear-gradient(90deg in oklch, oklch(30.31% 0.0868 352.27) 0.0%, oklch(31.79% 0.0913 353.73) 3.2%, oklch(33.90% 0.0977 355.86) 6.5%, oklch(36.32% 0.1049 358.16) 9.7%, oklch(38.78% 0.1118 0.12) 12.9%, oklch(41.07% 0.1177 1.33) 16.1%, oklch(43.50% 0.1238 2.07) 19.4%, oklch(45.95% 0.1295 2.49) 22.6%, oklch(48.25% 0.1341 2.72) 25.8%, oklch(50.27% 0.1367 2.86) 29.0%, oklch(52.25% 0.1385 3.26) 32.3%, oklch(54.13% 0.1393 3.68) 35.5%, oklch(55.60% 0.1376 3.57) 38.7%, oklch(56.29% 0.1321 2.39) 41.9%, oklch(55.81% 0.1202 0.72) 45.2%, oklch(54.12% 0.1013 0.05) 48.4%, oklch(51.89% 0.0799 357.72) 51.6%, oklch(49.82% 0.0607 350.90) 54.8%, oklch(48.56% 0.0482 336.52) 58.1%, oklch(47.87% 0.0409 310.80) 61.3%, oklch(47.52% 0.0369 278.57) 64.5%, oklch(47.45% 0.0361 246.83) 67.7%, oklch(47.60% 0.0381 222.61) 71.0%, oklch(48.20% 0.0444 209.50) 74.2%, oklch(49.37% 0.0560 203.23) 77.4%, oklch(50.58% 0.0689 201.15) 80.6%, oklch(51.25% 0.0793 200.66) 83.9%, oklch(50.84% 0.0837 199.69) 87.1%, oklch(49.21% 0.0824 200.41) 90.3%, oklch(46.97% 0.0782 202.52) 93.5%, oklch(44.78% 0.0734 204.91) 96.8%, oklch(43.31% 0.0703 206.43) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.303 | 0.087 | 352.3 |
| 2 | 0.398 | 0.114 | 360.7 |
| 3 | 0.5 | 0.136 | 362.8 |
| 4 | 0.563 | 0.13 | 361.8 |
| 5 | 0.488 | 0.051 | 341.7 |
| 6 | 0.476 | 0.039 | 220.2 |
| 7 | 0.512 | 0.083 | 200.1 |
| 8 | 0.433 | 0.07 | 206.4 |

## In these collections

- [Pink and teal gradients](https://grabient.com/pink-and-teal-gradients)
- [Hero section gradients](https://grabient.com/hero-section-gradients)

## Other forms

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