DOCS/Effects

Vignette

Stylize

Darken the edges to pull the eye to the centre.

A soft darkening around the frame edge. It is one of the cheapest ways to direct attention, and one of the easiest to overdo.

What it looks like

Before

Vignette

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#

Focusing attention on a central subject.
Adding a photographic feel to synthetic imagery.
Darkening busy corners so overlaid text stays readable.

Parameters#

Amountamount#

How dark the edges go. If a viewer can consciously see the vignette, it is too strong.

Sizesize#

How far in the darkening reaches.

Softnesssoftness#

The gradient width. Low values produce a visible ring, which is almost never what you want.

Shapeshape#

Circle or ellipse. Ellipse follows the frame proportions and is the natural choice for wide compositions.

Vignette

When to reach for it#

Parameters#

See also#