Arrow Download Off icon

Use the Arrow Download Off 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 { ArrowDownloadOff24Regular, ArrowDownloadOff24Filled } from "@fluentui/react-icons";

export function Example() {
  return <ArrowDownloadOff24Regular aria-label="Arrow Download Off" />;
}

Use it in HTML

Reference the SVG file directly:

<img src="https://fluenticons.co/icons/ic_fluent_arrow_download_off_24_regular.svg" width="24" height="24" alt="Arrow Download Off">

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="M3.28034 2.21968C2.98745 1.92678 2.51257 1.92677 2.21968 2.21966C1.92678 2.51255 1.92677 2.98743 2.21966 3.28032L10.9993 12.0602L10.999 16.4329L7.27997 12.7192L7.1958 12.6467C6.90204 12.429 6.48539 12.4535 6.21931 12.72C5.92661 13.0131 5.92694 13.4879 6.22003 13.7806L11.2235 18.7772L11.3076 18.8498C11.6012 19.0673 12.0176 19.043 12.2837 18.7769L15.0001 16.0611L20.7194 21.7805C21.0123 22.0734 21.4872 22.0734 21.7801 21.7805C22.073 21.4876 22.073 21.0127 21.7801 20.7198L3.28034 2.21968ZM13.9393 15.0002L12.499 16.4399L12.4992 13.5601L13.9393 15.0002ZM17.1218 13.9399L16.0611 12.8792L16.2208 12.7196C16.4871 12.4533 16.9038 12.4291 17.1974 12.647L17.2815 12.7197C17.5477 12.986 17.5719 13.4026 17.354 13.6962L17.2814 13.7803L17.1218 13.9399ZM10.9996 7.81764L12.4995 9.31756L12.5 2.75488L12.4932 2.65311C12.4435 2.28704 12.1297 2.00488 11.75 2.00488L11.6482 2.01173C11.2822 2.06139 11 2.37519 11 2.75488L10.9996 7.81764ZM18.2498 20.4999C18.664 20.4998 19 20.8355 19 21.2497C19 21.6639 18.6644 21.9998 18.2502 21.9999L5.25022 22.0037C4.836 22.0038 4.5 21.6681 4.5 21.2539C4.5 20.8397 4.83557 20.5038 5.24978 20.5037L18.2498 20.4999Z" fill="currentColor"/></svg>

Use it from the SVG package

Microsoft's @fluentui/svg-icons package contains the raw SVG files, which works well with bundlers that import SVGs:

npm install @fluentui/svg-icons

import icon from "@fluentui/svg-icons/icons/arrow_download_off_24_regular.svg";

Details

Keywords

pointdirectiondownverticaldownloadoffdisabledprohibitedpermission