Focal Point

Define a focal point that should remain centered when resizing the image by appending filters:focal(X1xY1:X2xY2). Think of the focal point as a small rectangular area that is defined by the respective coordinates.

Note

Usually, content editors would define a focal point in the CMS. If a focus point has been set, the coordinates will be included in the focus property of the asset field and can be used as a value for the focal point filter.

Try setting a focal point in the interactive demo below. See it being kept visible as you progress to resize the image.

Copied to the clipboard

Copy parameters Open preview image in a new browser tab

Width

0 600

Height

0 400

Focal Point

Enable

Set focal point

Once enabled, click on the button to show the image in the original aspect ratio. Proceed by clicking on the image to set the desired focal point.