x

Open in Github Open in StackBlitz
@twicpics-components
Documentation

focus property

The focus property will change the focus point coordinates of the image (only useful with mode="cover").
It allows to determine what should be visible when the image is cropped.

You can set the focus by using coordinates or auto values:

  • Coordinates represent a point in the image, specified as a couple of positive lengths, separated by the character x.
    As an example, in focus="1920x1282":
    - 1920 is the coordinate along the x-axis (following the width of the image)
    - and 1282 is the coordinate along the y-axis (following the height of the image)
  • If auto is used in place of actual coordinates, the focus point will be chosen automagically for you!

If you only need border-based positionning (top, bottom, etc), use anchor instead.

No focus (default)
No focus (default)
focus="1920x1282"
focus="auto"