Create beautiful CSS gradients with live preview
background: linear-gradient(to right, #3b82f6 0%, #8b5cf6 100%);.gradient-bg {\n background: linear-gradient(to right, #3b82f6 0%, #8b5cf6 100%);\n}bg-[linear-gradient(to_right,_#3b82f6_0%,_#8b5cf6_100%)]Create smooth transitions between colors along a straight line. Perfect for backgrounds, buttons, and creating depth.
Radiate colors from a center point outward in a circular or elliptical pattern. Great for spotlight effects and focal points.
Rotate colors around a center point. Perfect for creating pie charts, progress indicators, and rainbow effects.