Markdown Image
Learn how to add images in markdown with alt text, titles, and links. Syntax, sizing workarounds, and platform support.
What is markdown image?
Images in markdown use the same syntax as links but with an exclamation mark prefix: . The alt text describes the image for screen readers and when the image fails to load.
Syntax
Basic image
Exclamation mark + brackets for alt text + parentheses for the image URL.
Image with title
Add a title in quotes for a tooltip on hover.
Linked image
Wrap an image in link syntax to make it clickable.
Platform support
| Platform | Supported | Notes |
|---|---|---|
| GitHub | Yes | Drag-and-drop upload in issues/PRs |
| GitLab | Yes | — |
| Discord | No | Paste/upload images directly instead |
| Slack | No | Upload images directly |
| Partial | Image posts, not inline markdown images | |
| Stack Overflow | Yes | Upload via editor |
| Notion | Yes | Paste or /image command |
| Obsidian | Yes | Also supports ![[wikilink]] images |
Common mistakes
[image](url.png)
Missing the exclamation mark (!) creates a link, not an image. The ! tells markdown to embed the image.
Empty alt text hurts accessibility. Always describe the image for screen readers.
Relative paths can break depending on the renderer. Prefer ./ prefix or absolute URLs for reliability.
Tips for image
Alt text is essential for accessibility. Describe what the image shows in a few words — screen readers depend on it.
Markdown has no native image sizing. Use HTML for control: <img src="url" width="300" alt="text" />.
<img src="photo.jpg" width="400" alt="A photo" />
In GitHub repos, use relative paths like ./images/photo.png so images work across branches and forks.
Frequently asked questions
Everything you need to know.
How do I add an image in markdown?
Use  syntax. The exclamation mark distinguishes images from links. Example: .
Related elements
Link
Links in markdown use square brackets for the display text and parentheses for the URL: [text](url). You can also add hover titles, use reference-style links for cleaner source, and auto-link bare URLs on most platforms.
Bold
Bold text in markdown is created by wrapping words with double asterisks (**) or double underscores (__). Bold draws attention to important words and phrases, making your content easier to scan.
Heading
Markdown headings are created with hash symbols (#). One hash for H1 (largest), two for H2, up to six for H6 (smallest). Headings structure your document and create a hierarchy that readers and search engines can follow.
Try it in the editor
Paste your markdown and see image rendered instantly with professional themes.