I found that I have to use the address listed when going to that image in Github which is different from what people are saying below. ![title](https://github.com/username/reponame/blob/master/subfolders.../filename.jpg) Notice the "blob" term in the filename. The answers here didn't work for me in 2017.
– RyanNov 8 '17 at 15:46

Relative links are not a great use here, imagine your readme is also displayed on npm that does not host the image in this way - it needs to link to GitHub. Image srcs should be on the github.com domain, not the raw.github.com subdomain and not the raw.githubusercontent.com domain.
– Lee CrossleyJun 24 '14 at 6:25

1

I actually ended up going with the relative paths (which for me is just the name of the image file because I have everything in root). I had been maintaining 2 copies of the README.md, one for local installation in /usr/share/projectname/docs, and one for github. Now, I can just use the same README.md for both since the image filenames work fine in both cases. If I want to post a copy of parts of my README somewhere else, I'll either have to host the images somewhere else or put in the raw.github.com url.
– Colin KeenanSep 30 '14 at 23:23

Yes. This is by far the easiest way unless you're worried about performance.I'd note that this is relative to the directory not the repo, so if you have 'myimage.png' in the same dir as 'about_pics.md' then the markup is:![What is this](myimage.png)
– RichMar 8 '17 at 2:06

3

This is an awesome solution because 1) it works 2) images are also shown in a local viewer, with no need of internet access
– Régis B.May 22 '17 at 10:03

2

@Rich can you expand on your comment regarding performance. What performance issues are there with the relative path approach?
– Lea HayesSep 9 '17 at 18:41

Oh, I just thought that since this retrieves the image from the repo, it's intrinsically going to do more work than having the images on a CDN or whatever.
– RichSep 10 '17 at 22:27

This is also a good hint, but it's unfortunately not the answer to the README file. Copy-pasting stuff there does not work (at least not at the moment).
– Per LundbergFeb 14 '15 at 22:41

11

As far as I understand you do not really need to save the issue. This way you do not really need those dummy tickets in the Issue Tracker. Question is if this is a "safe" method, meaning if GitHub will detect (after some time) that the image is orphaned and therefore delete it from the GitHub CDN ??
– peterhOct 23 '16 at 9:11

This solution is funny but it works - and it's quick. Dragged and dropped images in New Issue, copied and pasted to the .md file. No need to save issue.
– silverJul 10 at 10:48

This answer works, and requires little effort. The issue can be discarded, but the URL for the image persists. The image URL is in the form of: user-images.githubusercontent.com...
– SabuncuNov 29 at 19:48

It's much simpler than that.

No, I don't think adding screenshots to the git repo is a good practice. Especially not at the root. Ahmad Ajmi's answer is much better
– Arnaud POct 10 '16 at 12:27

10

Not at the root but you can easily adapt this to docs/images or what ever, small png screenshots are ok IMHO
– Christophe RoussyJan 23 '17 at 10:12

3

This should be the accepted solution, esp. with Christophe's suggestion to put the images under the doc/ tree/
– Mike EllisApr 11 '17 at 21:01

perfect..!! if the png is in another folder. Simply, add the path "folderName/screenshot.png"
– SoumenMar 22 at 16:43

I found your answer useful for my case: I'm on Gitlab and I use logo.png pictures at the root of the repo to set an avatar to the repo. I wanted to include this pic to the README.md.
– avi.elkharratOct 31 at 10:02

Creating a dummy issue in the issue tracker is a hack. It creates clutter and confuses users. It's a pain to migrate this solution to a fork, or off GitHub.

Using the gh-pages branch makes the URLs brittle. Another person working on the project maintaining the gh-page may not know something external depends on the path to these images. The gh-pages branch has a particular behavior on GitHub which is not necessary for hosting CDN images.

Tracking assets in version control is a good thing. As a project grows and changes it's a more sustainable way to manage and track changes by multiple users.

If an image applies to a specific revision of the software, it may be preferable to link an immutable image. That way, if the image is later updated to reflect changes to the software, anyone reading that revision's readme will find the correct image.

My preferred solution, inspired by this gist, is to use an assets branch with permalinks to specific revisions.

This is a good complement to the accepted answer. Assets are tracked, images are not in master, no clutter. Just be careful about the git reset --hard; make sure changes were committed.
– dojubaSep 30 at 9:40

In the wild on your machine. You can point it to wherever the file happens to be (~/Downloads, /tmp, etc.).
– paulmelnikowDec 13 at 19:44

I need to include some images in my README File. I don't know how to
do that.

I created a small wizard that allows you to create and customize simple image galleries for your GitHub repository's readme: See ReadmeGalleryCreatorForGitHub.

The wizard takes advantage of the fact that GitHub allows img tags to occur in the README.md. Also, the wizard makes use of the popular trick of uploading images to GitHub by drag'n'dropping them in the issue area (as already mentioned in one of the answers in this thread).

In my case I wanted to show a print screen on Github but also on NPM. Even though using the relative path was working within Github, it wasn't working outside of it. Basically, even if I pushed my project to NPM as well (which simply uses the same readme.md, the image was never showing.

Where:
* ^github_username^ is the username in github (you can find it in the profile page)
* ^repo_name^ is the repository name
* ^branch^ is the repository branch where the image is uploaded
* ^image_location in the repo^ is the location including the folder that the image is stored.

Also you can upload the image first then visit the location in your projects github page and navigate through until you find the image then press the download button and then copy-paste the url from the browser's address bar.

Thank you for your interest in this question.
Because it has attracted low-quality or spam answers that had to be removed, posting an answer now requires 10 reputation on this site (the association bonus does not count).