Video Multiple icon

Use the Video 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 { VideoMultiple24Regular, VideoMultiple24Filled } from "@fluentui/react-icons";

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

Use it in HTML

Reference the SVG file directly:

<img src="https://fluenticons.co/icons/ic_fluent_video_multiple_24_regular.svg" width="24" height="24" alt="Video 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="M4.5 8.25C4.5 6.45507 5.95507 5 7.75 5H13.75C15.4287 5 16.8101 6.27271 16.982 7.90584L19.2484 6.31939C20.4082 5.50749 22.0019 6.33725 22.0019 7.75304V14.2471C22.0019 15.6629 20.4082 16.4927 19.2484 15.6808L16.982 14.0943C16.81 15.7274 15.4286 17 13.75 17H7.75C5.95507 17 4.5 15.5449 4.5 13.75V8.25ZM17 12.276L20.1086 14.4519C20.2743 14.5679 20.5019 14.4494 20.5019 14.2471V7.75304C20.5019 7.55079 20.2742 7.43225 20.1086 7.54824L17 9.72422V12.276ZM7.75 6.5C6.7835 6.5 6 7.2835 6 8.25V13.75C6 14.7165 6.7835 15.5 7.75 15.5H13.75C14.7165 15.5 15.5 14.7165 15.5 13.75V8.25C15.5 7.2835 14.7165 6.5 13.75 6.5H7.75ZM3.5 8.24994C3.5 8.16835 3.5023 8.08729 3.50684 8.00684C2.60094 8.58363 2 9.59678 2 10.7503V13.7503C2 16.9259 4.57436 19.5003 7.75 19.5003H11.25C12.4037 19.5003 13.4169 18.8992 13.9937 17.9931C13.913 17.9976 13.8318 17.9999 13.75 17.9999H11.2852C11.2735 18.0002 11.2618 18.0003 11.25 18.0003H7.75C5.40279 18.0003 3.5 16.0975 3.5 13.7503V8.24994Z" 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/video_multiple_24_regular.svg";

Details