video background effect icon
video-background-effect-32-filled from Fluent UI System Icons by Microsoft Corporation · 32 Filled · MIT Free for personal and commercial use.
- Name
- video-background-effect-32-filled
- Set
- Fluent UI System Icons
- Style
- 32 Filled
- Viewbox
- 32×32
- License
- MIT
11 other variants in Fluent UI System Icons
video-background-effect-16-filledvideo-background-effect-16-regularvideo-background-effect-20-filledvideo-background-effect-20-regularvideo-background-effect-24-filledvideo-background-effect-24-regularvideo-background-effect-28-filledvideo-background-effect-28-regularvideo-background-effect-32-regularvideo-background-effect-48-filledvideo-background-effect-48-regular
Related icons in Fluent UI System Icons
video-360-20-filledvideo-360-off-20-filledvideo-add-20-filledvideo-background-effect-horizontal-16-filledvideo-bluetooth-16-filledvideo-chat-16-filledvideo-clip-16-filledvideo-clip-multiple-16-filledvideo-clip-off-16-filledvideo-clip-optimize-16-filledvideo-clip-wand-16-filledvideo-link-24-filledvideo-multiple-16-filledvideo-off-16-filledvideo-people-32-filledvideo-person-12-filledvideo-person-call-16-filledvideo-person-clock-16-filledvideo-person-off-20-filledvideo-person-pulse-16-filledvideo-person-sparkle-16-filledvideo-person-sparkle-off-20-filledvideo-person-star-20-filledvideo-person-star-off-20-filled
Use the video background effect icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M2 8.586L6.586 4h2.828L2 11.414zm0 9.828v-2.828L13.586 4h2.828l-3.062 3.062a6.53 6.53 0 0 0-3.29 3.29zm0 4.172l7.76-7.76c.202.69.515 1.334.92 1.909l-2.525 2.524a4 4 0 0 0-.896.896l-5.202 5.203A3.3 3.3 0 0 1 2 24.75zM17.826 6.76c.69.202 1.334.515 1.909.92L23.415 4h-2.83zm3.878 3.121c.354.645.6 1.357.718 2.11l6.824-6.823a3.25 3.25 0 0 0-1.747-1.081zM3.885 27.701L6.5 25.086v2.828L6.414 28H5.25a3.2 3.2 0 0 1-1.365-.3M21.5 18.5c.427 0 .838.067 1.224.19L30 11.415V8.586L20.086 18.5zm4 4v.414l4.5-4.5v-2.828l-4.991 4.991c.313.57.491 1.226.491 1.923m1.25 5.5H25.5v-.914l4.5-4.5v2.164q0 .389-.087.752l-2.411 2.41a3.3 3.3 0 0 1-.752.088M8 22.5V28h16v-5.5a2.5 2.5 0 0 0-2.5-2.5h-11A2.5 2.5 0 0 0 8 22.5m8-4.5a5 5 0 1 0 0-10a5 5 0 0 0 0 10"/></svg>
React
import type { SVGProps } from "react";
export function FluentVideoBackgroundEffect32Filled(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M2 8.586L6.586 4h2.828L2 11.414zm0 9.828v-2.828L13.586 4h2.828l-3.062 3.062a6.53 6.53 0 0 0-3.29 3.29zm0 4.172l7.76-7.76c.202.69.515 1.334.92 1.909l-2.525 2.524a4 4 0 0 0-.896.896l-5.202 5.203A3.3 3.3 0 0 1 2 24.75zM17.826 6.76c.69.202 1.334.515 1.909.92L23.415 4h-2.83zm3.878 3.121c.354.645.6 1.357.718 2.11l6.824-6.823a3.25 3.25 0 0 0-1.747-1.081zM3.885 27.701L6.5 25.086v2.828L6.414 28H5.25a3.2 3.2 0 0 1-1.365-.3M21.5 18.5c.427 0 .838.067 1.224.19L30 11.415V8.586L20.086 18.5zm4 4v.414l4.5-4.5v-2.828l-4.991 4.991c.313.57.491 1.226.491 1.923m1.25 5.5H25.5v-.914l4.5-4.5v2.164q0 .389-.087.752l-2.411 2.41a3.3 3.3 0 0 1-.752.088M8 22.5V28h16v-5.5a2.5 2.5 0 0 0-2.5-2.5h-11A2.5 2.5 0 0 0 8 22.5m8-4.5a5 5 0 1 0 0-10a5 5 0 0 0 0 10"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M2 8.586L6.586 4h2.828L2 11.414zm0 9.828v-2.828L13.586 4h2.828l-3.062 3.062a6.53 6.53 0 0 0-3.29 3.29zm0 4.172l7.76-7.76c.202.69.515 1.334.92 1.909l-2.525 2.524a4 4 0 0 0-.896.896l-5.202 5.203A3.3 3.3 0 0 1 2 24.75zM17.826 6.76c.69.202 1.334.515 1.909.92L23.415 4h-2.83zm3.878 3.121c.354.645.6 1.357.718 2.11l6.824-6.823a3.25 3.25 0 0 0-1.747-1.081zM3.885 27.701L6.5 25.086v2.828L6.414 28H5.25a3.2 3.2 0 0 1-1.365-.3M21.5 18.5c.427 0 .838.067 1.224.19L30 11.415V8.586L20.086 18.5zm4 4v.414l4.5-4.5v-2.828l-4.991 4.991c.313.57.491 1.226.491 1.923m1.25 5.5H25.5v-.914l4.5-4.5v2.164q0 .389-.087.752l-2.411 2.41a3.3 3.3 0 0 1-.752.088M8 22.5V28h16v-5.5a2.5 2.5 0 0 0-2.5-2.5h-11A2.5 2.5 0 0 0 8 22.5m8-4.5a5 5 0 1 0 0-10a5 5 0 0 0 0 10"/></svg> </template>
CSS
.icon-video-background-effect-32-filled {
width: 24px;
height: 24px;
background-color: currentColor;
-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M2%208.586L6.586%204h2.828L2%2011.414zm0%209.828v-2.828L13.586%204h2.828l-3.062%203.062a6.53%206.53%200%200%200-3.29%203.29zm0%204.172l7.76-7.76c.202.69.515%201.334.92%201.909l-2.525%202.524a4%204%200%200%200-.896.896l-5.202%205.203A3.3%203.3%200%200%201%202%2024.75zM17.826%206.76c.69.202%201.334.515%201.909.92L23.415%204h-2.83zm3.878%203.121c.354.645.6%201.357.718%202.11l6.824-6.823a3.25%203.25%200%200%200-1.747-1.081zM3.885%2027.701L6.5%2025.086v2.828L6.414%2028H5.25a3.2%203.2%200%200%201-1.365-.3M21.5%2018.5c.427%200%20.838.067%201.224.19L30%2011.415V8.586L20.086%2018.5zm4%204v.414l4.5-4.5v-2.828l-4.991%204.991c.313.57.491%201.226.491%201.923m1.25%205.5H25.5v-.914l4.5-4.5v2.164q0%20.389-.087.752l-2.411%202.41a3.3%203.3%200%200%201-.752.088M8%2022.5V28h16v-5.5a2.5%202.5%200%200%200-2.5-2.5h-11A2.5%202.5%200%200%200%208%2022.5m8-4.5a5%205%200%201%200%200-10a5%205%200%200%200%200%2010%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M2%208.586L6.586%204h2.828L2%2011.414zm0%209.828v-2.828L13.586%204h2.828l-3.062%203.062a6.53%206.53%200%200%200-3.29%203.29zm0%204.172l7.76-7.76c.202.69.515%201.334.92%201.909l-2.525%202.524a4%204%200%200%200-.896.896l-5.202%205.203A3.3%203.3%200%200%201%202%2024.75zM17.826%206.76c.69.202%201.334.515%201.909.92L23.415%204h-2.83zm3.878%203.121c.354.645.6%201.357.718%202.11l6.824-6.823a3.25%203.25%200%200%200-1.747-1.081zM3.885%2027.701L6.5%2025.086v2.828L6.414%2028H5.25a3.2%203.2%200%200%201-1.365-.3M21.5%2018.5c.427%200%20.838.067%201.224.19L30%2011.415V8.586L20.086%2018.5zm4%204v.414l4.5-4.5v-2.828l-4.991%204.991c.313.57.491%201.226.491%201.923m1.25%205.5H25.5v-.914l4.5-4.5v2.164q0%20.389-.087.752l-2.411%202.41a3.3%203.3%200%200%201-.752.088M8%2022.5V28h16v-5.5a2.5%202.5%200%200%200-2.5-2.5h-11A2.5%202.5%200%200%200%208%2022.5m8-4.5a5%205%200%201%200%200-10a5%205%200%200%200%200%2010%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fluent/video-background-effect-32-filled.svg?color=%231a73e8&size=48
