Image Widget

Docs > Dashboards > Widgets > Image Widget

The image widget allows you to embed an image on your dashboard. An image can be a PNG, JPG, or animated GIF, hosted where it can be accessed by URL:

Setup

Enter your image URL.
Choose an appearance:
- Zoom image to cover whole title
- Fit image on tile
- Center image on tile

API

This widget can be used with the Dashboards API. See the Dashboards API documentation for additional reference.

The dedicated widget JSON schema definition for the image widget is:

Expand All

Field

Type

Description

has_background

boolean

Whether to display a background or not.

has_border

boolean

Whether to display a border or not.

horizontal_align

enum

Horizontal alignment. Allowed enum values: center,left,right

margin

enum

Size of the margins around the image. Note: small and large values are deprecated. Allowed enum values: sm,md,lg,small,large

sizing

enum

How to size the image on the widget. The values are based on the image object-fit CSS properties. Note: zoom, fit and center values are deprecated. Allowed enum values: fill,contain,cover,none,scale-down,zoom,fit,center

type [required]

enum

Type of the image widget. Allowed enum values: image

url [required]

string

URL of the image.

url_dark_theme

string

URL of the image in dark mode.

vertical_align

enum

Vertical alignment. Allowed enum values: center,top,bottom

{
  "has_background": true,
  "has_border": true,
  "horizontal_align": "string",
  "margin": "string",
  "sizing": "string",
  "type": "image",
  "url": "https://example.com/image.png",
  "url_dark_theme": "https://example.com/image-dark-mode.png",
  "vertical_align": "string"
}

Image Widget

Setup

API

Further Reading