# Images

There are two possible directives for images. One is the image directive and the other is the figure directive.
Refer to [DocUtils](https://docutils.sourceforge.io/docs/ref/rst/directives.html#images) for more options.

```none
.. image:: images/checkmark.png
    :alt: checkmark
```

renders the image

![checkmark](examples/images/checkmark.png)

Whereas the figure directive allows you to use captions.

```none
.. figure:: images/checkmark.png
   :alt: checkmark

   This is the caption for the image
```

Renders the image as:

![checkmark](examples/images/checkmark.png)

## Resize images

You can resize images (and figures) with the option `width`.
When a reader clicks on an image with this option set, the image opens in a popup in full size.
This is handy when images are too small to be read from the documentation page.

For example:

```none
.. figure:: images/diagram.svg
   :width: 150px

.. image:: images/checkmark.png
   :width: 150px
```

Renders the image as:

![image](examples/images/diagram.svg)![image](examples/images/checkmark.png)

Click on the image to preview it in full size.