Skip to main content

Image

Use the Image component to display an image in your product. This renders the <img> HTML element and extends the Box component.

Usage Example#

Live Editor
Result

Props#

PropTypeDefaultDescription
altstring (optional)Sets alt attribute on image for accessibility.
heightstring (optional)'auto'
maxWidthstring (optional)'100%'
srcstring (required)Sets the src attribute of the img element.
themeobject (optional)Sets theme.

Image uses COMMON, LAYOUT, POSITION, FLEXBOX, BORDERS groups of Styled System props.