Window Multiple icon

Use the Window Multiple 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 { WindowMultiple24Regular, WindowMultiple24Filled } from "@fluentui/react-icons";

export function Example() {
  return <WindowMultiple24Regular aria-label="Window Multiple" />;
}

Use it in HTML

Reference the SVG file directly:

<img src="https://fluenticons.co/icons/ic_fluent_window_multiple_24_regular.svg" width="24" height="24" alt="Window Multiple">

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="M19.001 6.00977C20.6791 6.13743 22.001 7.5392 22.001 9.25V17.25C22.001 19.8734 19.8743 22 17.251 22H9.25098C7.5402 22 6.13942 20.6781 6.01172 19H7.52051C7.64192 19.8479 8.36945 20.5 9.25098 20.5H17.251C19.0459 20.5 20.501 19.0449 20.501 17.25V9.25C20.501 8.36847 19.8489 7.64095 19.001 7.51953V6.00977ZM14.75 2C16.5449 2 18 3.45507 18 5.25V14.75C18 16.5449 16.5449 18 14.75 18H5.25C3.45507 18 2 16.5449 2 14.75V5.25C2 3.45507 3.45507 2 5.25 2H14.75ZM3.5 14.75C3.5 15.7165 4.2835 16.5 5.25 16.5H14.75C15.7165 16.5 16.5 15.7165 16.5 14.75V7.5H3.5V14.75ZM5.25 3.5C4.2835 3.5 3.5 4.2835 3.5 5.25V6H16.5V5.25C16.5 4.2835 15.7165 3.5 14.75 3.5H5.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/window_multiple_24_regular.svg";

Details

Keywords

rectangleshapewebappwindowui