← Back to functions
CSS Function
linear-gradient()
GradientsCreates a progressive transition between colors along a straight line.
Syntax
linear-gradient(direction, color1, color2, ...)
Example
background: linear-gradient(135deg, #0d0d0d, #1a1a1a);
Common use cases
- Subtle background textures
- Button hover effects
- Hero section overlays
Practical developer insight
Use repeating-linear-gradient() for striped patterns. Always provide a fallback solid color for environments that don't render gradients.