Imgix APIsRendering APIGradient and FadeGradient Stops

Gradient Stops

gradient-stops

The gradient-stops parameter sets where each gradient color sits along the gradient. Without it the colors are spaced evenly.

Pass one position per color, from 0 to 100. A stop lower than the one before it is raised to match, so the sequence never moves backwards.

Stops are what turn a gradient into a usable scrim. An even two-color fade darkens the middle of the picture as much as the edge; holding the transparent color until halfway down leaves the subject clear and darkens only the band the text sits on.

Evenly spaced, darkening the whole picture
sandbox-demo
gradient-stops=55,100 keeps the top half clear
sandbox-demo

A list with the wrong number of positions, or with values outside 0-100, is ignored and the colors are spaced evenly.