Widely available Helpful for explicit file downloads, exported reports, and generated assets where the user expects a saved file.

download

The HTMLAnchorElement.download property is a string indicating that the linked resource is intended to be downloaded rather than displayed in the browser. The value, if any, specifies the default file name for use in labeling the resource in a local file system. If the name is not a valid file name in the underlying OS, the browser will adjust it.

Note: This value might not be used for download. This value cannot be used to determine whether the download will occur.

LinksDownloadFiles

Browser support

Feature Desktop Mobile
Chrome
Edge
Firefox
Safari
Chrome Android
Safari iOS
api.HTMLAnchorElement.download
15
13
20
10.1
18
10.3
HTML attribute
download
14
18
20
10.1
18
13
download
54
12
20
10.1
54
10.3
DOM API
download

The download property of the HTMLAreaElement interface is a string indicating that the linked resource is intended to be downloaded rather than displayed in the browser. The value represent the proposed name of the file. If the name is not a valid filename of the underlying OS, browser will adjust it accordingly.
54
13
20
10.1
54
10.3
download

The download property of the SVGAElement interface returns a string indicating that the browser should treat the linked URL as a download.
142
142
20
142
Other
svg.elements.a.download
20
1+Supported (version) Not supported ※Has note Sub-feature descriptions sourced from MDN Web Docs (CC BY-SA 2.5)
Notes 1 item(s)
Implementation note
  • Starting in Chrome 65, cross-origin downloads are not supported on the `<a>` element.
Notes 5 item(s)
Implementation note
  • Starting in Edge 79, cross-origin downloads are not supported on the `<a>` element.
  • Until Edge 14 (build 14357), attempting to download data URIs caused Edge to crash (bug 7160092).
  • Edge 17 or older didn't follow the attributes' value to determine filename (bug 7260192).
Limitation
  • This browser only partially implements this feature
Removed
  • This feature was removed in a later browser version (18)
Notes 1 item(s)
Implementation note
  • Starting in Chrome Android 65, cross-origin downloads are not supported on the `<a>` element.

Syntax

HTML 

<a href="/files/data.csv" download="2024-report.csv">
  Download
</a>

<a href="/files/report.pdf" download>PDF</a>


<a href="/files/data.csv" download="2024-report.csv">
  Download
</a>



<!-- ファイル名を指定 -->
<a href="/files/data.csv" download="2024-report.csv">
  Report
</a>

Live demo

Direct file download

Use the download attribute with a data URL and a suggested filename.

PreviewFullscreen

Download card grid

Pair labels, file sizes, and download links in a simple asset list.

PreviewFullscreen

Downloadable SVG badge

Offer a generated SVG badge as a downloadable file without a separate endpoint.

PreviewFullscreen

Use cases

  • Exported reports

    Let users save invoices, CSV exports, or generated files with a predictable file name.

  • Asset downloads

    Offer templates, PDFs, or starter files as direct downloads instead of opening them in a new tab.

Cautions

  • Not every browser and origin combination treats download consistently, so test the exact hosting setup you use.
  • Make the file type and size obvious before download so the action feels intentional.

Accessibility

  • Link text should say that a download starts and ideally mention the file format.
  • Do not rely on icon-only affordances for download actions.

Related links