CSS3 Gradients Explained
CSS gradients let you display smooth transitions between two or more specified colors. They are treated
as CSS images and are typically applied to the background-image property.
Linear vs Radial
- Linear Gradient: Colors flow in a straight line. You can control the direction (e.g., to right, to bottom right) or specific angle (e.g., 45deg).
- Radial Gradient: Colors flow outward from a central point, creating a circular or elliptical shape.
Browser Support
Modern CSS gradients are supported by all major browsers. This tool generates the standard syntax which works in Chrome, Firefox, Safari, and Edge.
Last Updated: