A GitHub profile banner is a wide header image placed at the very top of your profile README, above your identity text. It's optional, but a clean banner gives a profile visual structure that a text-only header can't.
Correct sizing
The most common mistake with banners is using an image that's too tall — it pushes your identity text and project cards below the fold on smaller screens. A width of roughly 1200–1500px and a height under 300px keeps the banner proportional across both desktop and the GitHub mobile app.
Embedding it correctly
<img src="https://your-image-url/banner.png" width="100%" alt="Profile banner" />
Using an <img> tag with a percentage width rather than a fixed pixel width is what keeps the banner responsive — a fixed width will overflow on narrow screens.
Where to host the image
You can host a banner directly inside your profile repository (upload it, then reference the raw GitHub URL) or use an external image host. Hosting inside the repo is more reliable long-term since it won't disappear if a third-party host changes its policy.
What to put on a banner
Simpler is stronger — your name or handle, your role, and a subtle background pattern or gradient. Avoid putting your entire pitch in the banner text; that's what the identity line below it is for.
Frequently Asked Questions
What image format works best for a GitHub banner?
PNG or SVG both render reliably; SVG has the advantage of staying sharp at any screen size since it's vector-based.
Can I use an animated banner?
Yes, an animated GIF or SVG will play automatically on the profile page, but keep the motion subtle so it doesn't distract from the content below it.
Will a banner slow down my profile page load?
A reasonably compressed image (under a few hundred KB) loads fast enough not to matter — very large uncompressed files are the only real risk.