Documentation Guides

Images #

You can insert images into your page, then choose their size and whether to align them to the left, center, or right.

You can reference local images to the documentation, in those cases they will be directly embedded in the output rendered file. External links will not be embedded.

Example of an image block #

The pirate bay logo

Representation in Markdown #

![The pirate bay logo](https://upload.wikimedia.org/wikipedia/commons/thumb/1/16/The_Pirate_Bay_logo.svg/1280px-The_Pirate_Bay_logo.svg.png)

Image alignment #

Image pulled to the right (is-pulled-right) and the left (is-pulled-left):

<img src="https://rust-lang.github.io/mdBook/format/images/rust-logo-blk.svg" class="is-pulled-right" />
<img src="https://rust-lang.github.io/mdBook/format/images/rust-logo-blk.svg" class="is-pulled-left" />

Image modifiers #

Bulma image modifiers are available:

<figure class="image is-128x128">
  <img src="https://bulma.io/assets/images/placeholders/128x128.png" />
</figure>

<figure class="image is-128x128">
  <img class="is-rounded" src="https://bulma.io/assets/images/placeholders/128x128.png" />
</figure>