Skip to main content

Image

The Image Primitive on Page

The Image primitive represents an image

The Image properties specify the source of the image, the cropping method, and alignment when cropping. You can also adjust sources for devices with high pixel densities and for different layouts. The Loading property helps speed up page loading.

Available props#

Prop nameDescription
object fitDefines the way the content should fill the container relative to its height and width
object positionUsed with object fit and specifies the position of the contents inside the container
srcImage link
srcsetA comma-separated list of one or more lines defining a set of possible images to display in the browser. Each line of the list must contain a pixel width or pixel density descriptor
sizesA list of image sizes for different page sizes. It contains comma-separated media queries with image width values
altAlternative text description of the image will be displayed in the browser if the image couldn't be loaded
titleThe image title that will be shown as a tooltip when you hover over the image
loadingPostpone image loading outside the screen