Image

EmbeddedImageProps

The Image component extends the html img element with a bunch of style utilities and the ability to more easily utilize images on your local file system without needing to copy or move them.

Hint:

Make sure to checkout the FigRef component here to reference figures within your notes dynamically.

Example

<Image
  url="/assets/images/demos/definitelyMe.jpg"
  lg
  center
  desc="Me in the selfie I took for my dating profile."
/>

Properties

Prop	Type	Default
`file`	`string`	-
`url`	`string`	-
`src`	`string`	-
`image`	`string`	-
`left`	`boolean`	-
`center`	`boolean`	-
`right`	`boolean`	-
`inline`	`boolean`	-
`width`	`string \| number`	-
`height`	`string \| number`	-
`block`	`boolean`	-
`full`	`boolean`	-
`fullWidth`	`boolean`	-
`md`	`boolean`	-
`sm`	`boolean`	-
`lg`	`boolean`	-
`xl`	`boolean`	-
`small`	`boolean`	-
`medium`	`boolean`	-
`large`	`boolean`	-
`border`	`boolean`	-
`bordered`	`boolean`	-
`circle`	`boolean`	-
`desc`	`any`	-
`descLeft`	`boolean`	-
`descRight`	`boolean`	-
`notFigure`	`boolean`	-
`id`	`string`	-
`label`	`boolean`	-

Image

EmbeddedImageProps

Example

Properties

On this page

docs

demos

funding