An image in Markdown is a link with an exclamation mark in front of it. That is the entire syntax, and the similarity is not a coincidence: [text](url) fetches a page,  embeds a picture.
An image with a title:
An image that is also a link:
[](/markdown-guide)
An image with a title:
An image that is also a link:
The alt text is not optional
The text in the square brackets is the alt text — the description read aloud by a screen reader, and the text shown if the image fails to load. It is the one part of image syntax people skip, and the one that matters most.
Write what the image shows, not what it is:
The first is invisible to a blind reader. The second tells them nothing. The third conveys the point of the image — which is also what a search engine reads to understand it.
The exception: an image that is purely decorative should have empty alt text, , so a screen reader skips it rather than announcing a filename.
Titles
As with links, a quoted string after the path becomes a tooltip:
It is not a caption and not a substitute for alt text — it does not appear on touch devices at all.
Images as links
Wrap the whole image in link syntax. The nesting reads oddly the first time:
[](https://apps.apple.com/app/id6752715912)
The alt text now describes the destination as well as the picture, so make it say where the click goes.
Reference style
Long image paths clutter a paragraph just as link URLs do, and the same fix applies:
![The editor on Mac][mac-shot]
[mac-shot]: /images/mac-editor.png "Split view with live preview"
Size, alignment and captions
Markdown has no syntax for image size. None for alignment, none for captions either. This is deliberate: Markdown describes content, and how big a picture is belongs to the stylesheet.
Three honest options:
- Resize the file. Usually the right answer — a 4000 px photo displayed at 600 px is wasted bandwidth on every page load.
- Style it with CSS, targeting the images inside your content area. One rule covers every image in the document.
- Use raw HTML,
<img src="…" width="600" alt="…">, accepting that the file stops being portable Markdown.
Some tools invent their own extension —  and similar. It works in that tool and nowhere else. Avoid it unless you never intend to move the file.
For a caption, a line of italic text directly under the image is the conventional workaround.
Paths
Relative paths are almost always the better choice inside a site or a repository:
They keep working when the domain changes and they work offline. Absolute URLs make sense for images hosted elsewhere — but remember that if that host disappears, so does your image.
Common mistakes
Forgetting the !. Without it you get a link to the image instead of the image.
Empty alt text everywhere. Fine for decoration, a real accessibility failure for anything that carries meaning.
Spaces in the filename. Wrap the path in angle brackets or percent-encode them, exactly as for links.
Expecting the image to resize. There is no syntax for it. Resize the file or write a CSS rule.
Linking to an image that does not exist yet. The preview shows a broken icon and it is easy to ship. Check the path before publishing.
FAQ
How do I add an image in Markdown?
Write . The exclamation mark is what distinguishes an image from a link, the square brackets hold the alt text and the parentheses hold the path.
How do I resize an image in Markdown?
You cannot, in standard Markdown — there is no size syntax. Resize the image file itself, add a CSS rule for images in your content, or fall back to an HTML <img> tag with a width attribute at the cost of portability.
What should I write in Markdown alt text?
Describe what the image shows and why it is there — “Downloads tripled after the March release” rather than “chart”. If the image is purely decorative, leave the alt text empty so screen readers skip it.
How do I make an image clickable in Markdown?
Nest the image inside link syntax: [](https://example.com). The image becomes the link’s content.
Can I add a caption to an image in Markdown?
Not directly. The usual convention is a line of italic text immediately below the image. Renderers that support it will sometimes turn that into a real <figcaption>; most will simply show it as italic text, which reads as a caption anyway.