Video Clip Multiple icon

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

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

Use it in HTML

Reference the SVG file directly:

<img src="https://fluenticons.co/icons/ic_fluent_video_clip_multiple_24_regular.svg" width="24" height="24" alt="Video Clip 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="M8 7.7518V13.249C8 13.8419 8.65544 14.2003 9.15462 13.8805L13.7729 10.9213C14.08 10.7246 14.0799 10.276 13.7729 10.0793L9.15461 7.1203C8.65542 6.80047 8 7.15894 8 7.7518ZM5.25 3C3.45507 3 2 4.45507 2 6.25V15.25C2 17.0449 3.45508 18.5 5.25 18.5H15.75C17.5449 18.5 19 17.0449 19 15.25V6.25C19 4.45507 17.5449 3 15.75 3H5.25ZM3.5 6.25C3.5 5.2835 4.2835 4.5 5.25 4.5H15.75C16.7165 4.5 17.5 5.2835 17.5 6.25V15.25C17.5 16.2165 16.7165 17 15.75 17H5.25C4.2835 17 3.5 16.2165 3.5 15.25V6.25ZM5.01074 19.5C5.58828 20.4021 6.59923 21 7.74983 21H16.2498C19.1493 21 21.4998 18.6495 21.4998 15.75V8.74999C21.4998 7.59938 20.9019 6.58843 19.9998 6.01089V15.75C19.9998 17.8211 18.3209 19.5 16.2498 19.5H5.01074Z" 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_clip_multiple_24_regular.svg";

Details

Keywords

videofilmclipmediacontentcamerarecordingcapturestack