Video 360 icon

Used to represent general video meetings, views & settings in video meetings. The Video 360 icon is part of Microsoft's Fluent UI System Icons, available here in regular and filled styles in 2 sizes from 20 to 24 px. Download it as SVG or PNG, or copy it as code — it's free to use under the MIT License.

Regular (outlined)

SVG

Filled

SVG

Every size and style

Microsoft draws each size separately so icons stay crisp, rather than scaling one drawing. Pick a style and size to preview it, download it, or copy the code for your platform.

Regular, 24 px

ic_fluent_video_360_24_regular.svg

Video 360 icon in React

npm install @fluentui/react-icons

import { Video36024Regular } from "@fluentui/react-icons";

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

Video 360 icon in SVG

npm install @fluentui/svg-icons

import icon from "@fluentui/svg-icons/icons/video_360_24_regular.svg";

<!-- or load it from a CDN -->
<img src="https://cdn.jsdelivr.net/npm/@fluentui/svg-icons@1.1.341/icons/video_360_24_regular.svg" width="24" height="24" alt="Video 360">

Video 360 icon in Blazor

Microsoft's Fluent UI Blazor icons package:

dotnet add package Microsoft.FluentUI.AspNetCore.Components.Icons

<FluentIcon Value="@(new Icons.Regular.Size24.Video360())" />

Video 360 icon in Flutter

flutter pub add fluentui_system_icons

import 'package:fluentui_system_icons/fluentui_system_icons.dart';

Icon(FluentIcons.video_360_24_regular)

Video 360 icon in WinUI / WPF

Add FluentSystemIcons-Regular.ttf from Microsoft's repository to your app, then use the glyph:

<!-- WinUI 3 (font in Assets/Fonts) -->
<FontIcon FontFamily="ms-appx:///Assets/Fonts/FluentSystemIcons-Regular.ttf#FluentSystemIcons-Regular" Glyph="&#xEDF2;" FontSize="24" />

<!-- WPF (font in Fonts/, Build Action: Resource) -->
<TextBlock FontFamily="pack://application:,,,/Fonts/#FluentSystemIcons-Regular" Text="&#xEDF2;" FontSize="24" />

Video 360 icon in Icon font

<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/microsoft/fluentui-system-icons@9cf8af0f95a555918a60b8147a2f33a6a1248442/fonts/FluentSystemIcons-Regular.css">

<i class="icon-ic_fluent_video_360_24_regular"></i>

/* or use the code point in your own CSS */
.icon::before {
  font-family: "FluentSystemIcons-Regular";
  content: "\edf2";
  font-size: 24px;
}

Video 360 icon in Android

// build.gradle
implementation("com.microsoft.design:fluent-system-icons:1.1.341@aar")

<!-- layout XML -->
<ImageView android:src="@drawable/ic_fluent_video_360_24_regular" />

// Kotlin
R.drawable.ic_fluent_video_360_24_regular

Video 360 icon in iOS

# Podfile
pod "FluentIcons", "1.1.341"

import FluentIcons

UIImage(fluent: .video36024Regular)

Video 360 icon in Power Apps

Paste into an Image control's Image property. The Copy button copies the full formula with this icon's SVG.

"data:image/svg+xml;utf8, " & EncodeUrl("<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'>…</svg>")

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

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

Coding agents can look up this component through the Fluent Icons MCP server.

Use it in HTML

Reference the SVG file directly:

<img src="https://fluenticons.co/icons/ic_fluent_video_360_24_regular.svg" width="24" height="24" alt="Video 360">

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="M13.5 11.4997C13.5 12.3281 12.8284 12.9997 12 12.9997C11.1716 12.9997 10.5 12.3281 10.5 11.4997C10.5 10.6713 11.1716 9.99969 12 9.99969C12.8284 9.99969 13.5 10.6713 13.5 11.4997ZM7 13.9996C7.82843 13.9996 8.5 13.3281 8.5 12.4996C8.5 11.6712 7.82843 10.9996 7 10.9996C6.17157 10.9996 5.5 11.6712 5.5 12.4996C5.5 13.3281 6.17157 13.9996 7 13.9996ZM17 13.9996C17.8284 13.9996 18.5 13.3281 18.5 12.4996C18.5 11.6712 17.8284 10.9996 17 10.9996C16.1716 10.9996 15.5 11.6712 15.5 12.4996C15.5 13.3281 16.1716 13.9996 17 13.9996ZM2 6.3157C1.99999 4.87485 3.31849 3.82436 4.69176 4.01693C6.2677 4.23792 8.80859 4.49973 12.0001 4.49973C15.1915 4.49973 17.7324 4.23792 19.3083 4.01693C20.6816 3.82436 22.0001 4.87484 22.0001 6.3157V17.6845C22.0001 19.125 20.6822 20.1754 19.3091 19.9829C17.732 19.7618 15.1894 19.4997 12.0001 19.4997C8.81075 19.4997 6.2681 19.7618 4.69106 19.9829C3.31791 20.1754 2.00006 19.125 2.00005 17.6845L2 6.3157ZM4.48346 5.50239C3.95859 5.42879 3.5 5.83983 3.5 6.31569L3.50005 17.6845C3.50005 18.1602 3.95831 18.5709 4.48281 18.4974C4.64559 18.4746 4.8181 18.4514 5 18.4281V15.9996C5 15.4473 5.44772 14.9996 6 14.9996H8.5V18.1036C8.97657 18.075 9.47734 18.0511 10.0006 18.0334C10.0002 18.0222 10 18.011 10 17.9997V14.9997C10 14.4474 10.4477 13.9997 11 13.9997H13C13.5523 13.9997 14 14.4474 14 14.9997V17.9997C14 18.011 13.9998 18.0222 13.9994 18.0334C14.5227 18.051 15.0234 18.075 15.5 18.1036V14.9996H18C18.5523 14.9996 19 15.4473 19 15.9996V18.4281C19.1819 18.4514 19.3545 18.4746 19.5173 18.4974C20.0418 18.5709 20.5001 18.1602 20.5001 17.6845V6.3157C20.5001 5.83983 20.0415 5.4288 19.5166 5.5024C17.8837 5.73138 15.2723 5.99973 12.0001 5.99973C8.72777 5.99973 6.11642 5.73138 4.48346 5.50239Z" fill="currentColor"/></svg>

Details

NameVideo 360
StylesRegular (outlined), Filled
Sizes20 px, 24 px
Regular (outlined) fileic_fluent_video_360_24_regular.svg
Filled fileic_fluent_video_360_24_filled.svg
React (Regular)Video36020Regular, Video36024Regular
React (Filled)Video36020Filled, Video36024Filled
LicenseMIT (© Microsoft Corporation)

Keywords

videomeetingselfiecameraclipmediafront facingeffectscallchat

Related icons