Learn to embed videos in your GitHub README with our step-by-step guide using HTML video and iframe tags for local and external hosting best practices.
Book a call with an Expert
Starting a new venture? Need to upgrade your web app? RapidDev builds application with your growth in mind.
Step 1: Understand GitHub README rendering limitations
GitHub renders Markdown and supports a subset of HTML tags. You cannot use custom scripts, but you can embed videos by either hosting the video file in your repository and using the HTML
Step 2: Embed a locally hosted video with the HTML video tag
Place your video file (for example demo.mp4
) in your repository—ideally in a subfolder like assets/videos/
. Then reference it with a relative URL inside a
width
and height
attributes control display size.controls
displays play/pause, volume, and full-screen buttons.assets/videos/demo.mp4
matches your repo structure.
Step 3: Embed an externally hosted video with the HTML iframe tag
If you have a YouTube or Vimeo link, you can embed it directly. Obtain the embed URL (for YouTube: https://www.youtube.com/embed/VIDEO\_ID
). Then add:
VIDEO\_ID
with your actual video identifier.width
and height
to fit your README layout.allow
attribute enables autoplay and fullscreen features.
Step 4: Provide a clickable fallback or thumbnail link
Not all users can view embedded videos (mobile previews, email notifications, etc.). It’s best practice to include a static image or text link below your embed:
[!](https://youtu.be/VIDEO_ID)[Watch the video](https://img.youtube.com/vi/VIDEO_ID/0.jpg)
https://img.youtube.com/vi/VIDEO\_ID/0.jpg
for the default YouTube preview image.
Step 5: Commit and verify your README
After updating your README.md and adding any video files:
git add README.md assets/videos/demo.mp4
git commit -m "Embed demo video in README"
git push
Step 6: Follow best practices for performance and accessibility
When it comes to serving you, we sweat the little things. That’s why our work makes a big impact.