Sign Up

Image component

The <Image> component is similar to a standard Markdown image component, such as [alt text](/url.png), but adds the ability for you to set a different image in light mode and dark mode.

Usage

You can use the Image component set the light and dark mode image as follows:

<Image src="/_assets/light.png" src_dark="/_assets/dark.png" />

Try toggling dark and light mode in the header, and watch the image below change.

Props

The component accepts the following props as attributes.

NameDescriptionrequired
srcLight mode imageyes
src_darkDark mode imageno
altAlt textno

Was this page helpful?