Skip to content

Instantly share code, notes, and snippets.

@DavidWells
Last active June 21, 2026 23:23
Show Gist options
  • Select an option

  • Save DavidWells/7d2e0e1bc78f4ac59a123ddf8b74932d to your computer and use it in GitHub Desktop.

Select an option

Save DavidWells/7d2e0e1bc78f4ac59a123ddf8b74932d to your computer and use it in GitHub Desktop.
Guide to aligning images in github readme.md files. https://davidwells.io/snippets/how-to-align-images-in-markdown

Aligning images

This is a guide for aligning images.

See the full Advanced Markdown doc for more tips and tricks

left alignment

This is the code you need to align images to the left:

<img align="left" width="100" height="100" src="https://picsum.photos/100/100">

right alignment

This is the code you need to align images to the right:

<img align="right" width="100" height="100" src="https://picsum.photos/100/100">

center alignment example

<p align="center">
  <img width="460" height="300" src="https://picsum.photos/460/300">
</p>

Markdown Formatting on steriods

If you like this, you might enjoy markdown-magic. I built it to automatically format markdown files and allow folks to sync docs/code/data from external sources.

@RitamChakraborty

Copy link
Copy Markdown

THANK YOU SO SO MUCHHH WAAAA

❤️

@ire-landd

Copy link
Copy Markdown
IMG_7197

It just does this

@RitamChakraborty

Copy link
Copy Markdown

Try this.

<p align="center">
<img src="https://api.visitorbadge.io/api/visitors?path=Ire-landd&label=%EA%AB%82%E2%9D%81&labelColor=%23ff7ce&countColor=%23ffb6d&style=flat" alt="Visitor Count" />
</p>

Visitor Count

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment