Briefcase Off icon

Use the Briefcase 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 { BriefcaseOff24Regular, BriefcaseOff24Filled } from "@fluentui/react-icons";

export function Example() {
  return <BriefcaseOff24Regular aria-label="Briefcase Off" />;
}

Use it in HTML

Reference the SVG file directly:

<img src="https://fluenticons.co/icons/ic_fluent_briefcase_off_24_regular.svg" width="24" height="24" alt="Briefcase 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="M2.21973 2.21973C2.51262 1.92684 2.98738 1.92684 3.28027 2.21973L21.7803 20.7197C22.073 21.0126 22.0729 21.4874 21.7803 21.7803C21.4874 22.0731 21.0126 22.073 20.7197 21.7803L19.7715 20.832C19.4501 20.939 19.1074 21 18.75 21H5.25C3.45507 21 2 19.5449 2 17.75V9.25C2 7.55516 3.29735 6.16362 4.95312 6.01367L2.21973 3.28027C1.92684 2.98738 1.92684 2.51262 2.21973 2.21973ZM3.5 17.75C3.5 18.7165 4.2835 19.5 5.25 19.5H18.4395L13.6748 14.7354C13.4968 14.8988 13.2607 15 13 15H11C10.4477 15 10 14.5523 10 14H5.25C4.60533 14 4.00532 13.811 3.5 13.4873V17.75ZM13.75 2C14.9926 2 16 3.00736 16 4.25V6H18.75C20.5449 6 22 7.45507 22 9.25V17.75C22 18.0739 21.9515 18.3864 21.8633 18.6816L20.5 17.3184V13.4873C19.9947 13.811 19.3947 14 18.75 14H17.1816L15.6816 12.5H18.75C19.7165 12.5 20.5 11.7165 20.5 10.75V9.25C20.5 8.2835 19.7165 7.5 18.75 7.5H10.6816L8 4.81836V4.25C8 3.00736 9.00736 2 10.25 2H13.75ZM5.25 7.5C4.2835 7.5 3.5 8.2835 3.5 9.25V10.75C3.5 11.7165 4.2835 12.5 5.25 12.5H10V12C10 11.7393 10.1002 11.5022 10.2637 11.3242L6.43945 7.5H5.25ZM10.25 3.5C9.83579 3.5 9.5 3.83579 9.5 4.25V6H14.5V4.25C14.5 3.83579 14.1642 3.5 13.75 3.5H10.25Z" 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/briefcase_off_24_regular.svg";

Details

Keywords

organizationbusinessslash