# Petrol teal meets dusty rose

Tritone purple, teal and blue linear gradient with 56 colors: #cf6d94, #cb6c97, #c76b9a, #c16a9d, #bb6aa0, #b469a3, #ac68a5, #a468a7, #9b67a9, #9267a9, #8867a9, #7e66a8, #7466a6, #6b65a3, #61649f, #57639b, #4e6296, #456190, #3d608b, #355e85, #2e5d7f, #285b79, #225974, #1d586f, #18566a, #135466, #0e5363, #085260, #02515e, #00505c, #004f5b, #004e59, #004d59, #004c59, #004c59, #004b5a, #004b5a, #004b5c, #004a5d, #004a5f, #004a61, #004964, #004966, #00496a, #00486d, #004871, #004775, #00467a, #004580, #004486, #00428e, #003f97, #063c9c, #103a9e, #1639a0, #1a38a1. Edit it and copy or download CSS, SVG, PNG or shader code.

- Also called: Tritone purple, teal and blue linear gradient
- Seed: `kSp1_9MxkvLI_Rg`
- Page: https://grabient.com/kSp1_9MxkvLI_Rg?steps=56&angle=135
- Drawn as: linear gradient, 56 steps, 135 degrees
- Kinds: vivid, cool
- Hues: wide
- Contrast of its darkest and lightest colors: 2.9 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 | `#cf6d94` | `oklch(65.75% 0.1309 355.78)` | Hopbush | black, 6.2 to 1 |
| 2 | `#cb6c97` | `oklch(65.23% 0.1296 352.90)` | Fuchsia Kiss | black, 6.1 to 1 |
| 3 | `#c76b9a` | `oklch(64.63% 0.1279 349.44)` | Fuchsia Kiss | black, 5.9 to 1 |
| 4 | `#c16a9d` | `oklch(63.93% 0.1259 345.44)` | Crocus | black, 5.8 to 1 |
| 5 | `#bb6aa0` | `oklch(63.16% 0.1237 340.96)` | Pearly Purple | black, 5.6 to 1 |
| 6 | `#b469a3` | `oklch(62.32% 0.1212 336.04)` | Pearly Purple | black, 5.4 to 1 |
| 7 | `#ac68a5` | `oklch(61.41% 0.1184 330.73)` | Victorian Valentine | black, 5.3 to 1 |
| 8 | `#a468a7` | `oklch(60.44% 0.1155 325.08)` | Iris Orchid | black, 5.1 to 1 |
| 9 | `#9b67a9` | `oklch(59.43% 0.1124 319.14)` | Allium | black, 4.9 to 1 |
| 10 | `#9267a9` | `oklch(58.37% 0.1092 312.96)` | Amethyst Orchid | black, 4.7 to 1 |
| 11 | `#8867a9` | `oklch(57.28% 0.1059 306.58)` | Empire Violet | white, 4.6 to 1 |
| 12 | `#7e66a8` | `oklch(56.16% 0.1026 300.05)` | Purple Paradise | white, 4.8 to 1 |
| 13 | `#7466a6` | `oklch(55.02% 0.0992 293.43)` | Reign Over Me | white, 5 to 1 |
| 14 | `#6b65a3` | `oklch(53.87% 0.0958 286.75)` | Scampi | white, 5.2 to 1 |
| 15 | `#61649f` | `oklch(52.71% 0.0925 280.08)` | Iris Bloom | white, 5.4 to 1 |
| 16 | `#57639b` | `oklch(51.55% 0.0893 273.45)` | Iris Bloom | white, 5.7 to 1 |
| 17 | `#4e6296` | `oklch(50.41% 0.0862 266.91)` | Breathtaking | white, 5.9 to 1 |
| 18 | `#456190` | `oklch(49.27% 0.0832 260.52)` | Blue Beret | white, 6.2 to 1 |
| 19 | `#3d608b` | `oklch(48.16% 0.0804 254.31)` | Delft | white, 6.4 to 1 |
| 20 | `#355e85` | `oklch(47.08% 0.0778 248.35)` | Pelagic | white, 6.7 to 1 |
| 21 | `#2e5d7f` | `oklch(46.04% 0.0755 242.68)` | Dark Blue | white, 7 to 1 |
| 22 | `#285b79` | `oklch(45.04% 0.0734 237.34)` | Nautical Creatures | white, 7.3 to 1 |
| 23 | `#225974` | `oklch(44.10% 0.0716 232.39)` | Sacrifice | white, 7.6 to 1 |
| 24 | `#1d586f` | `oklch(43.21% 0.0702 227.87)` | Navy Teal | white, 7.8 to 1 |
| 25 | `#18566a` | `oklch(42.39% 0.0691 223.83)` | Corsair | white, 8.1 to 1 |
| 26 | `#135466` | `oklch(41.65% 0.0685 220.32)` | Plunge | white, 8.3 to 1 |
| 27 | `#0e5363` | `oklch(40.98% 0.0683 217.39)` | Rainy Morning | white, 8.6 to 1 |
| 28 | `#085260` | `oklch(40.41% 0.0686 215.08)` | Sandalwood Grey Blue | white, 8.8 to 1 |
| 29 | `#02515e` | `oklch(39.93% 0.0694 213.43)` | Sandalwood Grey Blue | white, 8.9 to 1 |
| 30 | `#00505c` | `oklch(39.51% 0.0690 212.39)` | Kali Blue | white, 9.1 to 1 |
| 31 | `#004f5b` | `oklch(39.16% 0.0682 211.84)` | Kali Blue | white, 9.2 to 1 |
| 32 | `#004e59` | `oklch(38.86% 0.0676 211.79)` | Watercolour Blue | white, 9.4 to 1 |
| 33 | `#004d59` | `oklch(38.61% 0.0673 212.19)` | Watercolour Blue | white, 9.5 to 1 |
| 34 | `#004c59` | `oklch(38.41% 0.0672 213.02)` | Watercolour Blue | white, 9.5 to 1 |
| 35 | `#004c59` | `oklch(38.25% 0.0673 214.23)` | Watercolour Blue | white, 9.6 to 1 |
| 36 | `#004b5a` | `oklch(38.14% 0.0677 215.79)` | Nocturnal Expedition | white, 9.7 to 1 |
| 37 | `#004b5a` | `oklch(38.06% 0.0683 217.66)` | Nocturnal Expedition | white, 9.7 to 1 |
| 38 | `#004b5c` | `oklch(38.03% 0.0691 219.82)` | Nocturnal Expedition | white, 9.7 to 1 |
| 39 | `#004a5d` | `oklch(38.02% 0.0704 222.22)` | Nocturnal Expedition | white, 9.7 to 1 |
| 40 | `#004a5f` | `oklch(38.04% 0.0720 224.83)` | Stegadon Scale Green | white, 9.7 to 1 |
| 41 | `#004a61` | `oklch(38.08% 0.0740 227.61)` | Stegadon Scale Green | white, 9.7 to 1 |
| 42 | `#004964` | `oklch(38.15% 0.0765 230.52)` | Stegadon Scale Green | white, 9.7 to 1 |
| 43 | `#004966` | `oklch(38.24% 0.0795 233.54)` | Stegadon Scale Green | white, 9.7 to 1 |
| 44 | `#00496a` | `oklch(38.33% 0.0832 236.63)` | Adriatic | white, 9.7 to 1 |
| 45 | `#00486d` | `oklch(38.44% 0.0877 239.75)` | Broadwater Blue | white, 9.7 to 1 |
| 46 | `#004871` | `oklch(38.56% 0.0930 242.86)` | Broadwater Blue | white, 9.7 to 1 |
| 47 | `#004775` | `oklch(38.68% 0.0993 245.93)` | Medici Blue | white, 9.6 to 1 |
| 48 | `#00467a` | `oklch(38.80% 0.1069 248.93)` | Kolibri Blue | white, 9.6 to 1 |
| 49 | `#004580` | `oklch(38.92% 0.1159 251.82)` | Lost River | white, 9.6 to 1 |
| 50 | `#004486` | `oklch(39.03% 0.1266 254.56)` | Pacific Depths | white, 9.6 to 1 |
| 51 | `#00428e` | `oklch(39.14% 0.1396 257.12)` | Pacific Depths | white, 9.7 to 1 |
| 52 | `#003f97` | `oklch(39.22% 0.1556 259.47)` | Amalfitan Azure | white, 9.7 to 1 |
| 53 | `#063c9c` | `oklch(39.29% 0.1658 261.53)` | Amalfitan Azure | white, 9.8 to 1 |
| 54 | `#103a9e` | `oklch(39.34% 0.1689 263.34)` | Amalfitan Azure | white, 9.8 to 1 |
| 55 | `#1639a0` | `oklch(39.37% 0.1715 264.83)` | Amalfitan Azure | white, 9.8 to 1 |
| 56 | `#1a38a1` | `oklch(39.37% 0.1736 265.96)` | Egyptian Blue | white, 9.9 to 1 |

## CSS

```css
background: linear-gradient(135deg, #cf6d94 0.0%, #cb6c97 1.8%, #c76b9a 3.6%, #c16a9d 5.5%, #bb6aa0 7.3%, #b469a3 9.1%, #ac68a5 10.9%, #a468a7 12.7%, #9b67a9 14.5%, #9267a9 16.4%, #8867a9 18.2%, #7e66a8 20.0%, #7466a6 21.8%, #6b65a3 23.6%, #61649f 25.5%, #57639b 27.3%, #4e6296 29.1%, #456190 30.9%, #3d608b 32.7%, #355e85 34.5%, #2e5d7f 36.4%, #285b79 38.2%, #225974 40.0%, #1d586f 41.8%, #18566a 43.6%, #135466 45.5%, #0e5363 47.3%, #085260 49.1%, #02515e 50.9%, #00505c 52.7%, #004f5b 54.5%, #004e59 56.4%, #004d59 58.2%, #004c59 60.0%, #004c59 61.8%, #004b5a 63.6%, #004b5a 65.5%, #004b5c 67.3%, #004a5d 69.1%, #004a5f 70.9%, #004a61 72.7%, #004964 74.5%, #004966 76.4%, #00496a 78.2%, #00486d 80.0%, #004871 81.8%, #004775 83.6%, #00467a 85.5%, #004580 87.3%, #004486 89.1%, #00428e 90.9%, #003f97 92.7%, #063c9c 94.5%, #103a9e 96.4%, #1639a0 98.2%, #1a38a1 100.0%);
background: linear-gradient(135deg in oklch, oklch(65.75% 0.1309 355.78) 0.0%, oklch(65.23% 0.1296 352.90) 1.8%, oklch(64.63% 0.1279 349.44) 3.6%, oklch(63.93% 0.1259 345.44) 5.5%, oklch(63.16% 0.1237 340.96) 7.3%, oklch(62.32% 0.1212 336.04) 9.1%, oklch(61.41% 0.1184 330.73) 10.9%, oklch(60.44% 0.1155 325.08) 12.7%, oklch(59.43% 0.1124 319.14) 14.5%, oklch(58.37% 0.1092 312.96) 16.4%, oklch(57.28% 0.1059 306.58) 18.2%, oklch(56.16% 0.1026 300.05) 20.0%, oklch(55.02% 0.0992 293.43) 21.8%, oklch(53.87% 0.0958 286.75) 23.6%, oklch(52.71% 0.0925 280.08) 25.5%, oklch(51.55% 0.0893 273.45) 27.3%, oklch(50.41% 0.0862 266.91) 29.1%, oklch(49.27% 0.0832 260.52) 30.9%, oklch(48.16% 0.0804 254.31) 32.7%, oklch(47.08% 0.0778 248.35) 34.5%, oklch(46.04% 0.0755 242.68) 36.4%, oklch(45.04% 0.0734 237.34) 38.2%, oklch(44.10% 0.0716 232.39) 40.0%, oklch(43.21% 0.0702 227.87) 41.8%, oklch(42.39% 0.0691 223.83) 43.6%, oklch(41.65% 0.0685 220.32) 45.5%, oklch(40.98% 0.0683 217.39) 47.3%, oklch(40.41% 0.0686 215.08) 49.1%, oklch(39.93% 0.0694 213.43) 50.9%, oklch(39.51% 0.0690 212.39) 52.7%, oklch(39.16% 0.0682 211.84) 54.5%, oklch(38.86% 0.0676 211.79) 56.4%, oklch(38.61% 0.0673 212.19) 58.2%, oklch(38.41% 0.0672 213.02) 60.0%, oklch(38.25% 0.0673 214.23) 61.8%, oklch(38.14% 0.0677 215.79) 63.6%, oklch(38.06% 0.0683 217.66) 65.5%, oklch(38.03% 0.0691 219.82) 67.3%, oklch(38.02% 0.0704 222.22) 69.1%, oklch(38.04% 0.0720 224.83) 70.9%, oklch(38.08% 0.0740 227.61) 72.7%, oklch(38.15% 0.0765 230.52) 74.5%, oklch(38.24% 0.0795 233.54) 76.4%, oklch(38.33% 0.0832 236.63) 78.2%, oklch(38.44% 0.0877 239.75) 80.0%, oklch(38.56% 0.0930 242.86) 81.8%, oklch(38.68% 0.0993 245.93) 83.6%, oklch(38.80% 0.1069 248.93) 85.5%, oklch(38.92% 0.1159 251.82) 87.3%, oklch(39.03% 0.1266 254.56) 89.1%, oklch(39.14% 0.1396 257.12) 90.9%, oklch(39.22% 0.1556 259.47) 92.7%, oklch(39.29% 0.1658 261.53) 94.5%, oklch(39.34% 0.1689 263.34) 96.4%, oklch(39.37% 0.1715 264.83) 98.2%, oklch(39.37% 0.1736 265.96) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.657 | 0.131 | 355.8 |
| 2 | 0.402 | 0.069 | 214.2 |
| 3 | 0.394 | 0.174 | 266 |

## In these collections

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

## Other forms

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