Movies and TV icon

Use the Movies and TV 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 { MoviesAndTv24Regular, MoviesAndTv24Filled } from "@fluentui/react-icons";

export function Example() {
  return <MoviesAndTv24Regular aria-label="Movies and TV" />;
}

Use it in HTML

Reference the SVG file directly:

<img src="https://fluenticons.co/icons/ic_fluent_movies_and_tv_24_regular.svg" width="24" height="24" alt="Movies and TV">

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.7289 3.91704L19.7799 4.07669L20.3312 5.99921C20.4359 6.3642 20.2512 6.74361 19.9129 6.89226L19.817 6.92689L9.09009 10.002L20.2492 10.0029C20.6289 10.0029 20.9426 10.2851 20.9923 10.6512L20.9992 10.7529V19.2509C20.9992 20.7135 19.8575 21.9093 18.4167 21.9959L18.2492 22.0009H5.7503C4.28777 22.0009 3.0919 20.8592 3.00532 19.4185L3.0003 19.2509L3.00009 10.859L2.47833 9.03785C2.07521 7.63197 2.84305 6.16773 4.20415 5.68738L4.3638 5.63638L16.3785 2.19122C17.7844 1.7881 19.2486 2.55595 19.7289 3.91704ZM19.4983 11.502H4.5003V19.2509C4.5003 19.855 4.92878 20.359 5.49838 20.4755L5.62249 20.4945L5.7503 20.5009H18.2492C18.8964 20.5009 19.4287 20.0091 19.4927 19.3787L19.4992 19.2509L19.4983 11.502ZM6.27298 6.64938L4.77726 7.07827C4.15512 7.25666 3.77896 7.87622 3.89116 8.49977L3.92018 8.6244L4.26452 9.82525L4.5596 9.74039L6.27298 6.64938ZM11.0293 5.28552L8.31182 6.06475L6.59844 9.15576L9.31593 8.37653L11.0293 5.28552ZM15.7866 3.92139L13.0691 4.70062L11.3557 7.79163L14.0723 7.01268L15.7866 3.92139ZM17.6338 3.68784L16.113 6.4275L18.6815 5.69124L18.3381 4.49015C18.2309 4.11643 17.9645 3.83149 17.6338 3.68784Z" 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/movies_and_tv_24_regular.svg";

Details

Keywords

movietvclapboardfilmentertainmentmedia