How to Center Images and Text in Github Markdown and READMEs

March 18, 2020

TLDR

To center images, text, and anything else in Github markdown and READMEs simply wrap the element in an HTML tag with the align attribute set to "center".

<p align="center">
    // Your content
</p>

Example

<p align="center">
  <img width="200" src="http://material-bread.org/logo-shadow.svg" alt="Material Bread logo">
</p>

Material Bread Readme Centered Logo

Also, check out the live example.

Align Text Defined As HTML Already

If your text is already defined in your markdown as an HTML tag, then you can add the align attribute directly on the HTML tag itself.

<h1 align="center">Material Bread</h1>