Visual Design
Gradient
A gradient is a smooth transition between two or more colors across a shape or background. It can run in any direction or radiate out from a point.
Why it matters
Gradients add depth and visual interest, but they go wrong easily. Knowing how they blend helps a beginner avoid muddy, dull-looking results.
In depth
A common problem is that blending two vivid colors through plain math can turn the midpoint a dull grey, because the path between them passes through a desaturated zone. Choosing a different color model for the blend, or adding a stop in the middle, keeps the transition lively. Subtle gradients with closely related colors tend to look more refined than dramatic ones.
Real-world example
A button might fade from a deep blue at the top to a brighter blue at the bottom, giving it a subtle sense of light and dimension.
Related terms