How to Make Anchor Link Download in HTML

Sometimes, you don't want to open a file in the browser, but rather, download it.

Thankfully, HTML supports making anchor links forcibly download the file.

In this post, we'll learn how we can make anchor links download a file instead of opening the file in the browser.

How to make anchor links download a file

To make an anchor link download a file, first start with the link you want to download.

In this case, let's assume the file you want to download is called file.mp3.

HTML
<a href="/path/to/file.mp3">
    Download
</a>

Without doing anything more, clicking on that link will open it in the browser and the native audio player will play the file.

To make this link download the file, we need to add an attribute to the anchor link.

When you add the download attribute, the browser will download the file instead of opening it in the browser.

Here's how our earlier link looks like with the download attribute added:

HTML
<a href="/path/to/file.mp3" download>
    Download
</a>

Now, when you click on this link, the browser will forcibly download the file.

This is helpful for when you want to give the user something like a receipt for a purchase, or to allow people to download your resume.

Conclusion

In this post, we've seen how we can transform anchor links into download links in HTML.

Use this when opening the file in the browser is not what you want.

Hope this helped, and happy coding!

• Support Us
• Discord
• Share
• Post
• Share