Props

a11yTitle

Custom label to be used by screen readers. When provided, an aria-label will be added to the element.

"a user friendly label for screen readers"

alignSelf

How to align along the cross axis when contained in a Box or along the column axis when contained in a Grid.

"start"
"center"
"end"
"stretch"

fallback

Specifies the URL of the fallback image used when src is failing to load

"string"

fill

Whether the width and/or height should fill the container.
"horizontal""vertical"truefalse

fit

How the image fills its container.
"cover""contain"

gridArea

The name of the area to place this inside a parent Grid.

"a parent grid area name"

margin

The amount of margin around the component. An object can be specified to distinguish horizontal margin, vertical margin, and margin on a particular side.

"xsmall"
"small"
"medium"
"large"
"xlarge"
{
  "vertical": "...",
  "horizontal": "...",
  "top": "...",
  "bottom": "...",
  "left": "...",
  "right": "..."
}

opacity

Transparency of the image.
"weak""medium""strong""string"truefalse

Theme

global.opacity.medium

The value used when opacity is set to true.
0.4

image.extend

Any additional style for the Image.
"any CSS"
(props) => {}