Introduction
The image component can be used to show an image. This image can be upload or can be pulled in from a url.
Configuration Options
Datasource
Expected Type: URL
The image to show. Either click on upload to quickly upload an image or alternatively, input a url that points to an image.
Object Fit
Expected Type: fill | contain | cover | none
The behaviour if the aspect ratio of the image is different from the aspect ratio of the component.
Triggers
Click:
Triggers whenever the image is clicked.Double Click:
Triggers whenever the image is clicked twice in quick succession.Right Click:
Triggers whenever the image is right-clicked.Mouse Enter:
Triggers whenever the mouse starts hovering over the component.Mouse Leave:
Triggers whenever the mouse stops hovering over the component.
Theme Options
Object Fit:
How the image should fill the container. For example, cover makes sure the image takes up all of the space, contain makes sure the image is fully visible and maintains its aspect ratio. (contain | cover | fill | none)Aspect Ratio:
The expected aspect ratio for the image. (16/9 | 4/3 | etc)Padding:
The image's padding. (Number | Pixels)Shadow:
The image's shadow. (Shadow)Border:
The image's border. You can also specify the radius for the edges. (Border)Background Color:
The image's background color. (String | Hex)