CSS Gradient Generator

Create beautiful linear and radial gradients with multiple color stops. Save your favorites and export as CSS or Tailwind CSS.

Random Number Dice Roller Coin Flip Random Name Lorem Ipsum Random Quote Random Group Random Joke Password Generator CSS Gradient Generator QR Code Generator All Generators

linear-gradient(to right, #4f46e5 0%, #06b6d4 100%)

Gradient Type

Direction

Color Stops

Output Format

Generated Code

background: linear-gradient(to right, #4f46e5 0%, #06b6d4 100%);