# Violet cyan coral bands Navy, purple, blue and pink linear gradient with 32 colors: #17122b, #1c1633, #241a3e, #2d1f4c, #38255a, #422a68, #4c2f75, #53337f, #5b3788, #623a90, #673e98, #6b43a1, #6b4bab, #6657b6, #5468c1, #387cc3, #168dbd, #1299b4, #27a0b2, #33a2ba, #499ecd, #7591dd, #a47ed4, #c46daf, #ce6183, #c75b6a, #b15365, #924a67, #6e4263, #4c3a55, #353142, #2a2a32. Edit it and copy or download CSS, SVG, PNG or shader code. - Also called: Navy, purple, blue and pink linear gradient - Seed: `kYNCPOsKrBEA1vzTpTYzjLTCSFtW` - Page: https://grabient.com/kYNCPOsKrBEA1vzTpTYzjLTCSFtW?steps=32&angle=165 - Drawn as: linear gradient, 32 steps, 165 degrees - Kinds: light center - Hues: multi-hue - Contrast of its darkest and lightest colors: 6 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 | `#17122b` | `oklch(20.47% 0.0482 290.39)` | Lost in Sadness | white, 18 to 1 | | 2 | `#1c1633` | `oklch(22.39% 0.0559 291.56)` | Lost in Sadness | white, 17.3 to 1 | | 3 | `#241a3e` | `oklch(25.07% 0.0667 293.31)` | Prune Plum | white, 16.2 to 1 | | 4 | `#2d1f4c` | `oklch(28.24% 0.0795 295.34)` | Elderberry | white, 14.8 to 1 | | 5 | `#38255a` | `oklch(31.59% 0.0927 297.31)` | Stormy Night | white, 13.3 to 1 | | 6 | `#422a68` | `oklch(34.84% 0.1052 298.91)` | Violet Indigo | white, 11.8 to 1 | | 7 | `#4c2f75` | `oklch(37.69% 0.1155 299.83)` | Mystic Nights | white, 10.6 to 1 | | 8 | `#53337f` | `oklch(40.01% 0.1235 300.41)` | Prism Violet | white, 9.7 to 1 | | 9 | `#5b3788` | `oklch(42.04% 0.1310 301.50)` | Kingfisher Daisy | white, 8.9 to 1 | | 10 | `#623a90` | `oklch(43.90% 0.1377 302.37)` | Daisy Bush | white, 8.3 to 1 | | 11 | `#673e98` | `oklch(45.69% 0.1430 302.28)` | Sweet Flag | white, 7.7 to 1 | | 12 | `#6b43a1` | `oklch(47.53% 0.1465 300.45)` | Poppy Pompadour | white, 7.1 to 1 | | 13 | `#6b4bab` | `oklch(49.53% 0.1477 296.15)` | Ultrapurple Merge | white, 6.5 to 1 | | 14 | `#6657b6` | `oklch(51.84% 0.1457 287.56)` | Blue Marguerite | white, 5.8 to 1 | | 15 | `#5468c1` | `oklch(54.62% 0.1390 271.66)` | Borage Blue | white, 5 to 1 | | 16 | `#387cc3` | `oklch(57.61% 0.1295 251.91)` | Celestial Plum | black, 4.8 to 1 | | 17 | `#168dbd` | `oklch(60.54% 0.1191 232.33)` | Hawaiian Surf | black, 5.5 to 1 | | 18 | `#1299b4` | `oklch(63.11% 0.1097 216.95)` | Barrier Reef | black, 6.2 to 1 | | 19 | `#27a0b2` | `oklch(65.03% 0.1034 209.80)` | Fischer Blue | black, 6.7 to 1 | | 20 | `#33a2ba` | `oklch(66.08% 0.1023 215.16)` | Jamaican Sea | black, 7 to 1 | | 21 | `#499ecd` | `oklch(66.66% 0.1080 236.07)` | Peaceful River | black, 7 to 1 | | 22 | `#7591dd` | `oklch(66.80% 0.1178 267.47)` | Little Boy Blue | black, 6.8 to 1 | | 23 | `#a47ed4` | `oklch(66.40% 0.1287 303.15)` | Wisteria | black, 6.5 to 1 | | 24 | `#c46daf` | `oklch(65.34% 0.1377 336.89)` | Sugar Creek | black, 6.1 to 1 | | 25 | `#ce6183` | `oklch(63.51% 0.1417 2.44)` | Cinnamon Satin | black, 5.6 to 1 | | 26 | `#c75b6a` | `oklch(60.77% 0.1375 13.69)` | Candy Drop | black, 5.1 to 1 | | 27 | `#b15365` | `oklch(56.38% 0.1234 10.06)` | Kissed by a Zombies | white, 4.8 to 1 | | 28 | `#924a67` | `oklch(50.59% 0.1020 356.21)` | Glitterati | white, 6.1 to 1 | | 29 | `#6e4263` | `oklch(44.16% 0.0769 336.41)` | Wizard Time | white, 8 to 1 | | 30 | `#4c3a55` | `oklch(37.86% 0.0517 314.94)` | Purple Velvet | white, 10.3 to 1 | | 31 | `#353142` | `oklch(32.47% 0.0299 296.06)` | Oil Rush | white, 12.5 to 1 | | 32 | `#2a2a32` | `oklch(28.74% 0.0152 284.05)` | Night Sky | white, 14.2 to 1 | ## CSS ```css background: linear-gradient(165deg, #17122b 0.0%, #1c1633 3.2%, #241a3e 6.5%, #2d1f4c 9.7%, #38255a 12.9%, #422a68 16.1%, #4c2f75 19.4%, #53337f 22.6%, #5b3788 25.8%, #623a90 29.0%, #673e98 32.3%, #6b43a1 35.5%, #6b4bab 38.7%, #6657b6 41.9%, #5468c1 45.2%, #387cc3 48.4%, #168dbd 51.6%, #1299b4 54.8%, #27a0b2 58.1%, #33a2ba 61.3%, #499ecd 64.5%, #7591dd 67.7%, #a47ed4 71.0%, #c46daf 74.2%, #ce6183 77.4%, #c75b6a 80.6%, #b15365 83.9%, #924a67 87.1%, #6e4263 90.3%, #4c3a55 93.5%, #353142 96.8%, #2a2a32 100.0%); background: linear-gradient(165deg in oklch, oklch(20.47% 0.0482 290.39) 0.0%, oklch(22.39% 0.0559 291.56) 3.2%, oklch(25.07% 0.0667 293.31) 6.5%, oklch(28.24% 0.0795 295.34) 9.7%, oklch(31.59% 0.0927 297.31) 12.9%, oklch(34.84% 0.1052 298.91) 16.1%, oklch(37.69% 0.1155 299.83) 19.4%, oklch(40.01% 0.1235 300.41) 22.6%, oklch(42.04% 0.1310 301.50) 25.8%, oklch(43.90% 0.1377 302.37) 29.0%, oklch(45.69% 0.1430 302.28) 32.3%, oklch(47.53% 0.1465 300.45) 35.5%, oklch(49.53% 0.1477 296.15) 38.7%, oklch(51.84% 0.1457 287.56) 41.9%, oklch(54.62% 0.1390 271.66) 45.2%, oklch(57.61% 0.1295 251.91) 48.4%, oklch(60.54% 0.1191 232.33) 51.6%, oklch(63.11% 0.1097 216.95) 54.8%, oklch(65.03% 0.1034 209.80) 58.1%, oklch(66.08% 0.1023 215.16) 61.3%, oklch(66.66% 0.1080 236.07) 64.5%, oklch(66.80% 0.1178 267.47) 67.7%, oklch(66.40% 0.1287 303.15) 71.0%, oklch(65.34% 0.1377 336.89) 74.2%, oklch(63.51% 0.1417 2.44) 77.4%, oklch(60.77% 0.1375 13.69) 80.6%, oklch(56.38% 0.1234 10.06) 83.9%, oklch(50.59% 0.1020 356.21) 87.1%, oklch(44.16% 0.0769 336.41) 90.3%, oklch(37.86% 0.0517 314.94) 93.5%, oklch(32.47% 0.0299 296.06) 96.8%, oklch(28.74% 0.0152 284.05) 100.0%); ``` ## Keyframes 6 OKLCH keyframes joined by a Catmull-Rom spline. Hue is unwrapped degrees. | Keyframe | Lightness | Chroma | Hue | | --- | --- | --- | --- | | 1 | 0.205 | 0.048 | 290.4 | | 2 | 0.382 | 0.117 | 299.9 | | 3 | 0.504 | 0.147 | 293.6 | | 4 | 0.657 | 0.102 | 211.1 | | 5 | 0.614 | 0.139 | 372.8 | | 6 | 0.287 | 0.015 | 284.1 | ## In these collections - [Discord server banner gradients](https://grabient.com/discord-server-banner-gradients) ## Other forms - [JSON](https://grabient.com/kYNCPOsKrBEA1vzTpTYzjLTCSFtW.json?steps=32&angle=165) - [PNG](https://grabient.com/kYNCPOsKrBEA1vzTpTYzjLTCSFtW.png?steps=32&angle=165) - [SVG](https://grabient.com/kYNCPOsKrBEA1vzTpTYzjLTCSFtW.svg?steps=32&angle=165) - [CSS](https://grabient.com/kYNCPOsKrBEA1vzTpTYzjLTCSFtW.css?steps=32&angle=165) - [ASE](https://grabient.com/kYNCPOsKrBEA1vzTpTYzjLTCSFtW.ase?steps=32&angle=165) - [GPL](https://grabient.com/kYNCPOsKrBEA1vzTpTYzjLTCSFtW.gpl?steps=32&angle=165) - [GRD](https://grabient.com/kYNCPOsKrBEA1vzTpTYzjLTCSFtW.grd?steps=32&angle=165) - [Design tokens](https://grabient.com/kYNCPOsKrBEA1vzTpTYzjLTCSFtW.tokens.json?steps=32&angle=165) - [Social card](https://grabient.com/api/og?seed=kYNCPOsKrBEA1vzTpTYzjLTCSFtW&steps=32&angle=165) - [Palettes like this one](https://grabient.com/palettes?q=kYNCPOsKrBEA1vzTpTYzjLTCSFtW) - [Guide for agents](https://grabient.com/llms.txt)