How can one display images side by side in a GitHub README.md?

The easiest way I can think of solving this is using the tables included in GitHub's flavored markdown.

To your specific example it would look something like this:

Solarized dark             |  Solarized Ocean :-------------------------:|:-------------------------: ![](https://...Dark.png)  |  ![](https://...Ocean.png) 

This creates a table with Solarized Dark and Ocean as headers and then contains the images in the first row. Obviously you would replace the ... with the real link. The :s are optional (They just center the content in the cells, which is kinda unnecessary in this case). Also you might want to downsize the images so they will display better side-by-side.

This will display the three images side by side if the images are not too wide.

<p float="left">   <img src="/img1.png" width="100" />   <img src="/img2.png" width="100" />    <img src="/img3.png" width="100" /> </p> 

You can place each image side-by-side by writing the markdown for each image on the same line.

![alt-text-1](image1.png "title-1") ![alt-text-2](image2.png "title-2") 

As long as the images aren't too large, they will display inline as demonstrated by this screen shot of a README file from GitHub:

Similar to the other examples, but using html sizing, I use:

<img src="image1.png" width="425"/> <img src="image2.png" width="425"/>  

Here is an example

<img src="https://openclipart.org/image/2400px/svg_to_png/28580/kablam-Number-Animals-1.png" width="200"/> <img src="https://openclipart.org/download/71101/two.svg" width="300"/> 

I tested this using Remarkable.

This is the best way to make add images/screenshots of your app and keep your repository look clean.

Create a screenshot folder in your repository and add the images you want to display.

Now go to README.md and add this HTML code to form a table.

#### Flutter App Screenshots  <table>   <tr>     <td>First Screen Page</td>      <td>Holiday Mention</td>      <td>Present day in purple and selected day in pink</td>   </tr>   <tr>     <td><img src="screenshots/Screenshot_1582745092.png" width=270 height=480></td>     <td><img src="screenshots/Screenshot_1582745125.png" width=270 height=480></td>     <td><img src="screenshots/Screenshot_1582745139.png" width=270 height=480></td>   </tr>  </table> 

In the <td><img src="(COPY IMAGE PATH HERE)" width=270 height=480></td>

** To get the image path --> Go to the screenshot folder and open the image and on the right most side, you will find Copy path button.

You will get a table like this in your repository--->