How to add screenshot to READMEs in github repository?

Question

If you use Markdown (README.md):

Provided that you have the image in your repo, you can use a relative URL:

![Alt text](/relative/path/to/img.jpg?raw=true "Optional Title")

If you need to embed an image that's hosted elsewhere, you can use a full URL

![Alt text](http://full/path/to/img.jpg "Optional title")

GitHub recommend that you use relative links with the ?raw=true parameter to ensure forked repos point correctly.

The raw=true parameter is there in order to ensure the image you link to, will be rendered as is. That means that only the image will be linked to, not the whole GitHub interface for that respective file. See this comment for more details.

Check out an example: https://raw.github.com/altercation/solarized/master/README.md

If you use SVGs then you'll need to set the sanitize attribute to true as well: ?raw=true&sanitize=true. (Thanks @EliSherer)

Also, the documentation on relative links in README files: https://help.github.com/articles/relative-links-in-readmes

And of course the markdown docs: http://daringfireball.net/projects/markdown/syntax

Additionally, if you create a new branch screenshots to store the images you can avoid them being in the master working tree

You can then embed them using:

![Alt text](/../<branch name>/path/to/image.png?raw=true "Optional Title")

Even though there is already an accepted answer I would like to add another way to upload images to readme on GitHub.

• You need to create issue in your repo
• Drag and drop in the comment area your image
• After link for the image is generated insert it to your readme

More details you can find here

I found that the path to the image in my repo did not suffice, I had to link to the image on the raw.github.com subdomain.

URL format https://raw.github.com/{USERNAME}/{REPOSITORY}/{BRANCH}/{PATH}

Markdown example ![Settings Window](https://raw.github.com/ryanmaxwell/iArrived/master/Screenshots/Settings.png)

JUNE 3, 2020 : WORKING ANSWER-

1. Upload your image to postimage.org
2. Copy Github-Markdown-Url after uploading Image
3. Insert in your ReadMe

One line below should be what you looking for

if your file is in repository

![ScreenShot](https://raw.github.com/{username}/{repository}/{branch}/{path})

if your file is in other external url

![ScreenShot](https://{url})

The markdown syntax for displaying images is indeed:

![image](https://{url})

BUT: How to provide the url ?

• You probably do not want to clutter your repo with screenshots, they have nothing to do with code
• you might not want either to deal with the hassle of making your image available on the web... (upload it to a server... ).

So... you can use this awesome trick to make github host your image file. TDLR:

1. create an issue on the issue list of your repo
2. drag and drop your screenshot on this issue
3. copy the markdown code that github has just created for you to display your image
4. paste it on your readme (or wherever you want)

http://solutionoptimist.com/2013/12/28/awesome-github-tricks/

Much simpler than adding URL Just upload an image to the same repository, like:

![Screenshot](screenshot.png)