Slide Eraser icon

Use the Slide Eraser 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 { SlideEraser24Regular, SlideEraser24Filled } from "@fluentui/react-icons";

export function Example() {
  return <SlideEraser24Regular aria-label="Slide Eraser" />;
}

Use it in HTML

Reference the SVG file directly:

<img src="https://fluenticons.co/icons/ic_fluent_slide_eraser_24_regular.svg" width="24" height="24" alt="Slide Eraser">

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 6.75C2 5.23122 3.23122 4 4.75 4H19.25C20.7688 4 22 5.23122 22 6.75V12.5356L21.1991 11.7347C20.9899 11.5255 20.7529 11.3612 20.5 11.2416V6.75C20.5 6.05964 19.9404 5.5 19.25 5.5H4.75C4.05964 5.5 3.5 6.05964 3.5 6.75V17.25C3.5 17.9404 4.05964 18.5 4.75 18.5H12.0149C12.0319 19.0338 12.2189 19.5632 12.576 20H4.75C3.23122 20 2 18.7688 2 17.25V6.75Z" fill="currentColor"/>
<path d="M20.4919 12.4418C19.9062 11.856 18.9564 11.856 18.3706 12.4417L15.26 15.5524L19.4671 19.7595L22.5777 16.6489C23.1635 16.0631 23.1635 15.1133 22.5777 14.5275L20.4919 12.4418Z" fill="currentColor"/>
<path d="M13.453 17.3593L14.5529 16.2595L18.76 20.4666L17.6601 21.5665C17.0743 22.1522 16.1246 22.1522 15.5388 21.5665L13.453 19.4807C12.8672 18.8949 12.8672 17.9451 13.453 17.3593Z" 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/slide_eraser_24_regular.svg";

Details

Keywords

slidelandscapedocumentpresentationeditdeleteclear