image
Element
Element functions can be customized with set and show rules.
set and show rules.A raster or vector graphic.
Supported formats are PNG, JPEG, GIF and SVG.
Note: Work on SVG export is ongoing and there might be visual inaccuracies in the resulting PDF. Make sure to double-check embedded SVG images. If you have an issue, also feel free to report it on GitHub.
Example
#figure(
image("molecular.jpg", width: 80%),
caption: [
A step in the molecular testing
pipeline of our lab.
],
)
Parameters
Parameters are the inputs to a function. They are specified in parentheses after the function name.
path
Path to an image file.
format
The image's format. Detected automatically by default.
-
"png"Raster format for illustrations and transparent graphics.
-
"jpg"Lossy raster format suitable for photos.
-
"gif"Raster format that is typically used for short animated clips.
-
"svg"The vector graphics format of the web.
Default:auto
width
The width of the image.
Default:auto
height
The height of the image.
Default:auto
alt
A text describing the image.
Default:none
fit
Settable
Settable parameters can be customized for all following uses of the function with a set rule.
set rule.How the image should adjust itself to a given area.
-
"cover"The image should completely cover the area. This is the default.
-
"contain"The image should be fully contained in the area.
-
"stretch"The image should be stretched so that it exactly fills the area, even if this means that the image will be distorted.
Default:"cover"
Definitions
Functions and types and can have associated definitions. These are accessed by specifying the function or type, followed by a period, and then the definition's name.
decode
Decode a raster or vector graphic from bytes or a string.
View example
#let original = read("diagram.svg")
#let changed = original.replace(
"#2B80FF", // blue
green.to-hex(),
)
#image.decode(original)
#image.decode(changed)
data
The data to decode as an image. Can be a string for SVGs.
format
The image's format. Detected automatically by default.
-
"png"Raster format for illustrations and transparent graphics.
-
"jpg"Lossy raster format suitable for photos.
-
"gif"Raster format that is typically used for short animated clips.
-
"svg"The vector graphics format of the web.
width
The width of the image.
height
The height of the image.
alt
A text describing the image.
fit
How the image should adjust itself to a given area.
-
"cover"The image should completely cover the area. This is the default.
-
"contain"The image should be fully contained in the area.
-
"stretch"The image should be stretched so that it exactly fills the area, even if this means that the image will be distorted.