Document Split Hint Off icon

Use the Document Split Hint 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 { DocumentSplitHintOff24Regular, DocumentSplitHintOff24Filled } from "@fluentui/react-icons";

export function Example() {
  return <DocumentSplitHintOff24Regular aria-label="Document Split Hint Off" />;
}

Use it in HTML

Reference the SVG file directly:

<img src="https://fluenticons.co/icons/ic_fluent_document_split_hint_off_24_regular.svg" width="24" height="24" alt="Document Split Hint 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.28035 2.21967C2.98746 1.92678 2.51258 1.92677 2.21968 2.21966C1.92678 2.51255 1.92677 2.98742 2.21967 3.28032L4.00002 5.06067V11.2499C4.00002 11.6641 4.33581 11.9999 4.75003 11.9999C5.16425 11.9999 5.50004 11.6641 5.50004 11.2499V6.56069L18.5002 19.5609V19.9999C18.5002 20.276 18.2763 20.4999 18.0002 20.4999H16.7502C16.3359 20.4999 16.0002 20.8357 16.0002 21.2499C16.0002 21.6641 16.3359 21.9999 16.7502 21.9999H18.0002C18.795 21.9999 19.4815 21.5363 19.804 20.8647L20.7197 21.7803C21.0125 22.0732 21.4874 22.0732 21.7803 21.7803C22.0732 21.4874 22.0732 21.0126 21.7803 20.7197L19.7935 18.7328C19.785 18.7239 19.7762 18.7151 19.7673 18.7066L3.28035 2.21967ZM12.0001 7.99996C12.0001 8.49291 12.1788 8.94438 12.4748 9.29314L12.7069 9.52526C13.0557 9.8213 13.5072 9.99995 14.0001 9.99995H18.5002V11.2499C18.5002 11.6641 18.836 11.9999 19.2502 11.9999C19.6644 11.9999 20.0002 11.6641 20.0002 11.2499V9.74995C20.0002 9.70747 19.9967 9.66582 19.9899 9.62527C19.9434 9.16958 19.7411 8.74085 19.4142 8.41396L13.5851 2.586C13.2195 2.22036 12.6866 2.00001 12.1721 2.00001H6.00004C5.75593 2.00001 5.52198 2.04382 5.30564 2.12399L6.68165 3.5H12.0001V7.99996ZM13.5001 4.62099L17.3782 8.49996H14.0001C13.7241 8.49996 13.5001 8.27496 13.5001 7.99996V4.62099ZM18.5002 15.3186L19.8614 16.6797C19.9488 16.5571 20.0002 16.407 20.0002 16.2449V13.7499C20.0002 13.3357 19.6644 12.9999 19.2502 12.9999C18.836 12.9999 18.5002 13.3357 18.5002 13.7499V15.3186ZM4.75003 12.9999C5.16425 12.9999 5.50004 13.3357 5.50004 13.7499V16.2449C5.50004 16.6591 5.16425 16.9949 4.75003 16.9949C4.33581 16.9949 4.00002 16.6591 4.00002 16.2449V13.7499C4.00002 13.3357 4.33581 12.9999 4.75003 12.9999ZM10.2501 20.4999C9.83587 20.4999 9.50008 20.8357 9.50008 21.2499C9.50008 21.6641 9.83587 21.9999 10.2501 21.9999H13.7501C14.1643 21.9999 14.5001 21.6641 14.5001 21.2499C14.5001 20.8357 14.1643 20.4999 13.7501 20.4999H10.2501ZM4.75003 18.4999C5.16425 18.4999 5.50004 18.8357 5.50004 19.2499V19.9999C5.50004 20.276 5.7239 20.4999 6.00004 20.4999H7.25006C7.66428 20.4999 8.00007 20.8357 8.00007 21.2499C8.00007 21.6641 7.66428 21.9999 7.25006 21.9999H6.00004C4.89546 21.9999 4.00002 21.1044 4.00002 19.9999V19.2499C4.00002 18.8357 4.33581 18.4999 4.75003 18.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/document_split_hint_off_24_regular.svg";

Details

Keywords

paperworkfileanaloghorizontal