MixavisdocsHomeCommunityOpen editor
DOCS/Effects

Gradient Overlay

Colour

Lay a colour gradient over the layer.

Draws a gradient across the layer, clipped to its silhouette. Depending on the blend mode it either replaces the fill or tints it while keeping the detail underneath.

What it looks like
Aa
Before
Aa
Screen
Aa
Overlay
Same artwork either side, so the difference you see is the effect. Built with the same SVG-filter primitives the product uses, but tuned for legibility at this size — treat it as a faithful illustration of the behaviour rather than a pixel-exact capture of the editor.

When to reach for it#

  • Making flat type or shapes look richer without changing the fill.
  • Adding a light-to-dark falloff across a large element.
  • Duotone and brand-gradient treatments.

Parameters#

Colour stopsstops#

The gradient itself. Two stops is a simple ramp; more give you bands. Stop positions are keyframable, so the gradient can travel across the layer.

Angleangle#

Direction of the ramp.

Typetype#

Linear ramps along the angle. Radial spreads from a centre point. Conic wraps around it, which is what you want for a colour wheel or a sweeping highlight.

Blend modeblend#

Normal replaces the fill. Overlay and Soft Light tint while preserving the underlying detail — usually the better choice on photographic content.

Opacityopacity#

Overall strength.

See also#

effectsGradient Map — driven by luminance instead of position→

Something here wrong or missing? Tell us in the community.