Image

Constrain an image to a given aspect ratio.

Polymorphic Component

By default, content is rendered inside an <img>, but this can be overriden by passing any valid tag name or component with the as prop.

Examples

<Image src={someImage} />
<Image src={someImage} aspectRatio="square" />
<Image src={someImage} aspectRatio="1:1" />

<Image 
  ...
  aspectRatio="3:2|4:3|5:4"
/>

<Image 
  ...
  aspectRatio="2:3|3:4|4:5"
/>

Name	Type	Default Value	Required	Description
`aspectRatio`	`"square" \| ImageAspectRatio \| "1:1" \| "2:3" \| "3:2" \| "3:4" \| "4:3" \| "4:5" \| "5:4"`	`ImageAspectRatio.Square`	No	Constrain the image to a specific aspect ratio.