Vaporwave CSS Gradient — Copy the Code

Hot pink through violet into cyan, the definitive retro-internet aesthetic. Copy the Vaporwave gradient as CSS, a custom property, or a Tailwind theme block, and check its text contrast.

Vaporwave CSS

background: linear-gradient(115deg in oklch, rgba(255, 113, 206, 1) 0%, rgba(185, 103, 255, 1) 50%, rgba(1, 205, 254, 1) 100%);

Color stops

  • #FF71CE at 0% (100% opacity)
  • #B967FF at 50% (100% opacity)
  • #01CDFE at 100% (100% opacity)

Edit this gradient · Browse all gradients · Check text over gradients