# How to embed a .png file in README.md

**URL:** <https://discourse.julialang.org/t/how-to-embed-a-png-file-in-readme-md/81859>\
**Category:** General Usage\
**Tags:** question\
**Created:** [May 29, 2022, 9:11am UTC](https://discourse.julialang.org/t/how-to-embed-a-png-file-in-readme-md/81859 "2022-05-29T09:11:32Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![ufechner7](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/ufechner7/32/51363_2.png) [@ufechner7](https://discourse.julialang.org/u/ufechner7)\
**Post date:** [May 29, 2022, 9:11am UTC](https://discourse.julialang.org/t/how-to-embed-a-png-file-in-readme-md/81859/1 "2022-05-29T09:11:32Z")

</div>

What is the best way of embedding a .png file in a README.md file for a package on Github?

I currently use:

```julia
<p align="center"><img src="./docs/kite_power_tools.png" width="500" /></p>

```

That works fine on github: [GitHub - aenarete/KiteSimulators.jl: Simulators for kite power systems](https://github.com/aenarete/KiteSimulators.jl)  
But it is causing problems in Juliahub, for example see: [Readme · KiteSimulators.jl](https://docs.juliahub.com/KiteSimulators/B8Yhn/0.1.1/)

Is there a way to use markdown syntax for embedding AND centering and resizing a picture?

---

<div class="post-metadata">

**Author:** ![cjdoris](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/cjdoris/32/213133_2.png) [@cjdoris](https://discourse.julialang.org/u/cjdoris)\
**Post date:** [May 29, 2022, 10:47am UTC](https://discourse.julialang.org/t/how-to-embed-a-png-file-in-readme-md/81859/2 "2022-05-29T10:47:29Z")

</div>

AFAIK no, websites are inconsistent about rendering HTML embedded in markdown - I had similar issues between GitHub, JuliaHub and PyPI.

Your best bet is to stick with plain markdown and ensure your image is the right size to begin with.

---

<div class="post-metadata">

**Author:** ![cjdoris](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/cjdoris/32/213133_2.png) [@cjdoris](https://discourse.julialang.org/u/cjdoris)\
**Post date:** [May 29, 2022, 10:50am UTC](https://discourse.julialang.org/t/how-to-embed-a-png-file-in-readme-md/81859/3 "2022-05-29T10:50:29Z")

</div>

Oh, and you’ll need to use an absolute URL for the images. A simple way is to link to them from GitHub - you can get the link by browsing to the file on GitHub and clicking the “Raw” button.

---

<div class="post-metadata">

**Author:** ![ufechner7](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/ufechner7/32/51363_2.png) [@ufechner7](https://discourse.julialang.org/u/ufechner7)\
**Post date:** [May 29, 2022, 10:50am UTC](https://discourse.julialang.org/t/how-to-embed-a-png-file-in-readme-md/81859/4 "2022-05-29T10:50:58Z")

</div>

Thanks!
