CSS Linear Gradients Explained
How linear gradients work in CSS and when to use them.
CSS linear gradients create smooth color transitions along a straight line. They are widely used for backgrounds, buttons, and hero sections without needing image files.
Basic syntax
- linear-gradient(angle, color1, color2) — angle in degrees (0 = up, 90 = right)
- Use at least two color stops
- Add more stops for multi-color gradients
- Combine with background-size for repeating patterns