How to Add Images on README .md File in a GitHub Repository From the Local System?

Adding images to your README.md file in a GitHub repository can significantly enhance the project documentation. Whether you’re showing screenshots, diagrams, or other visuals, including images can make your README more engaging and informative. This article will guide you through the process of adding images to your README.md file from your local system.

• A GitHub repository with a README.md file.
• Images stored on your local system that you want to include in the README.md file.
• Basic knowledge of Git commands

Images can convey information more effectively than text alone. Here are some reasons to include images in your README.md file:

• Visual Representation: Screenshots and diagrams can illustrate your project’s features and architecture.
• User Engagement: Good images can attract more attention and keep readers engaged.
• Clarity: Images can help clarify instructions and provide context, making your documentation easier to understand.

In order to add an image to the README file from the local system, follow the steps mentioned below where we illustrated to add an image in the README.md file.

Step 1: Open the Github website

Step 2: Now click on the top right corner to create a new repository.

Step 3: Now click on “Your repositories“.

Step 4: Click on the “New” option. This will redirect us to fill in details for our new repository.

Here, a new page will open which is depicted  

Step 5: Enter the details for your repository and click on the “Create repository” button to create a new repository. For illustration purposes, we are creating a public repository by the name “w3wiki“. We have given a description to our repository as “Adding an image to README.md“. Also check the checkbox, “Add a README file“. It will automatically append the README along with the repository. 

Now we have successfully created a new repository by the name “w3wiki“. For now, our README file has the following contents.

Step 6: Click on the pencil icon button to edit the README.md file.

Step 7: Drag and drop the image that you want to add to the README file. 

The image will be appended with the necessary codes:

Step 8: Click on the “Commit changes” button.

Final Output

We have added the image successfully. Likewise, we can any image to the README.md file.