Markdown cheatsheet · Images
Images in markdown
An image is a link with an exclamation mark in front: . The alt text describes the image; the parentheses hold where it lives.
The syntax
The path can be a full URL (https://…/photo.png) or a file relative to the markdown document, like assets/photo.png. Relative paths are what keep a notes folder portable: move the folder, and the images still resolve.
Write real alt text
The bracket text is what screen readers speak and what shows if the image fails to load; on the web it's also what search engines index. Describe the content (![Sales chart trending up 40% in Q3]), don't just label it (![chart]). Leaving it empty, , is valid and right for purely decorative images.
Image with a tooltip
Like links, images accept a quoted title after the path, shown on hover.
Clickable image (image as a link)
Nest the image syntax inside a link's brackets.
[](https://maxdown.app)
(the image links to maxdown.app)
Adding a caption
Markdown has no caption syntax, and the alt text isn't a caption: alt is read by screen readers and shown only when the image fails, never displayed alongside it. For a visible caption you have two routes.
The portable one is a line of italic text right under the image. It isn't a real caption semantically, but it reads as one and works in every renderer:
 *Figure 1: revenue climbed 40% in Q3.*
Figure 1: revenue climbed 40% in Q3.
The semantic route, where inline HTML is allowed, is <figure> with <figcaption>: <figure><img src="chart.png" alt="Sales by quarter"><figcaption>Figure 1</figcaption></figure>. It's the correct markup and pairs the caption to the image for assistive tech, but GitHub strips the styling so it renders plainly there.
Resizing an image
Full guide →Markdown itself has no size syntax. Where inline HTML is allowed (GitHub READMEs, most site generators), use an img tag instead:
<img src="logo.svg" alt="The logo" width="28">
Some tools (Obsidian, a few wikis) support the non-standard  form; it won't travel outside them. Which syntax works where is a guide of its own.
! is missing (that makes a link, not an image), the relative path is wrong from the file's location, or the path has a space in it: encode spaces as %20 or wrap the path in angle brackets.