Create beautiful CSS gradients visually. Add multiple color stops, adjust colors and positions, choose gradient type, and copy the generated CSS code with one click.
Linear Gradient: Colors transition along a straight line. Angle (0-360deg) controls direction. 0deg = top→bottom, 90deg = left→right.
Radial Gradient: Colors radiate from center outward. Default shape is circle.
CSS gradients (linear-gradient and radial-gradient) are supported in all modern browsers. IE10+ supports them as well.
Click "Add Stop" to add color nodes. Each node has its own color and position. Minimum 2 stops for a gradient effect.
Mainly background / background-image, also border-image, mask-image, and other advanced CSS properties.