<gradient>
A special image type that transitions smoothly between two or more colors. Common types include 'linear-gradient()', 'radial-gradient()', and 'conic-gradient()'.
Syntax
/* Usage Example */
.hero-bg {
/* A beautiful diagonal linear gradient */
background: linear-gradient(135deg, #3b82f6 0%, #2dd4bf 100%);
}
<gradient> Browser support
Widely available
Since
2015 96% global usage
This feature is well established and works across many devices and browser versions. It has been available across browsers since 2015.
26+
3.6+
7+
12+