How to add an image in Markdown?

Published on Aug. 22, 2023, 12:17 p.m.

To add an image in Markdown, you can use the following syntax:

![Alt text](image URL)

Here, Alt text refers to the alternative text that will be displayed if the image cannot be loaded, and image URL refers to the URL of the image that you want to insert. For example:

![A beautiful sunset](https://example.com/images/sunset.jpg)

When rendered, this syntax will produce an HTML <img> tag with the src attribute set to the image URL, and the alt attribute set to the Alt text. Note that you can also include a title for the image by using quotes around the Alt text like this:

![A beautiful sunset](https://example.com/images/sunset.jpg "Sunset at the beach")

This would result in a tooltip displaying “Sunset at the beach” when you hover over the image.

You can also use relative paths to images located in the same directory as your Markdown file. For example:

![Logo](./images/logo.png)

This would render an image with the file path ./images/logo.png relative to your Markdown file.

It’s also worth noting that some Markdown editors and viewers may not support the display of images from certain sources, so it’s always a good idea to check if the image displays correctly after you publish or share it.

Tags: