Arrow Download icon
Used for downloading content. The Arrow Download icon is part of Microsoft's Fluent UI System Icons, available here in regular, filled and light styles in 6 sizes from 16 to 48 px. Download it as SVG or PNG, or copy it as code — it's free to use under the MIT License.
Every size and style
Microsoft draws each size separately so icons stay crisp, rather than scaling one drawing. Pick a style and size to preview it, download it, or copy the code for your platform.
Regular, 24 px
ic_fluent_arrow_download_24_regular.svg
Arrow Download icon in React
npm install @fluentui/react-icons
import { ArrowDownload24Regular } from "@fluentui/react-icons";
export function Example() {
return <ArrowDownload24Regular aria-label="Arrow Download" />;
}Use the Arrow Download icon in React
Install Microsoft's @fluentui/react-icons package, then import the component. Icons inherit the current text color, and you can size them with CSS.
npm install @fluentui/react-icons
import { ArrowDownload24Regular, ArrowDownload24Filled } from "@fluentui/react-icons";
export function Example() {
return <ArrowDownload24Regular aria-label="Arrow Download" />;
}Coding agents can look up this component through the Fluent Icons MCP server.
Use it in HTML
Reference the SVG file directly:
<img src="https://fluenticons.co/icons/ic_fluent_arrow_download_24_regular.svg" width="24" height="24" alt="Arrow Download"> Or paste the SVG markup inline. Setting fill="currentColor" makes the icon follow the text color of its parent:
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M18.2498 20.5009C18.664 20.5008 19 20.8365 19 21.2507C19 21.6649 18.6644 22.0008 18.2502 22.0009L5.25022 22.0047C4.836 22.0048 4.5 21.6691 4.5 21.2549C4.5 20.8407 4.83557 20.5048 5.24978 20.5047L18.2498 20.5009ZM11.6482 2.01271L11.75 2.00586C12.1297 2.00586 12.4435 2.28801 12.4932 2.65409L12.5 2.75586L12.499 16.4409L16.2208 12.7205C16.4871 12.4543 16.9038 12.4301 17.1974 12.648L17.2815 12.7206C17.5477 12.9869 17.5719 13.4036 17.354 13.6972L17.2814 13.7813L12.2837 18.7779C12.0176 19.044 11.6012 19.0683 11.3076 18.8507L11.2235 18.7782L6.22003 13.7816C5.92694 13.4889 5.92661 13.014 6.21931 12.7209C6.48539 12.4545 6.90204 12.43 7.1958 12.6477L7.27997 12.7202L10.999 16.4339L11 2.75586C11 2.37616 11.2822 2.06237 11.6482 2.01271L11.75 2.00586L11.6482 2.01271Z" fill="currentColor"/></svg>Details
| Name | Arrow Download |
|---|---|
| Styles | Regular (outlined), Filled, Light |
| Sizes | 16 px, 20 px, 24 px, 28 px, 32 px, 48 px |
| Regular (outlined) file | ic_fluent_arrow_download_24_regular.svg |
| Filled file | ic_fluent_arrow_download_24_filled.svg |
| React (Regular) | ArrowDownload16Regular, ArrowDownload20Regular, ArrowDownload24Regular, ArrowDownload28Regular, ArrowDownload32Regular, ArrowDownload48Regular |
| React (Filled) | ArrowDownload16Filled, ArrowDownload20Filled, ArrowDownload24Filled, ArrowDownload28Filled, ArrowDownload32Filled, ArrowDownload48Filled |
| React (Light) | ArrowDownload32Light |
| License | MIT (© Microsoft Corporation) |