Live Off icon
Used to represent live content. The Live Off icon is part of Microsoft's Fluent UI System Icons, available here in filled and regular (outlined) styles on a 24 px grid. Download it as SVG or PNG, or copy it as code — it's free to use under the MIT License.
Use the Live Off 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 { LiveOff24Regular, LiveOff24Filled } from "@fluentui/react-icons";
export function Example() {
return <LiveOff24Regular aria-label="Live Off" />;
}Use it in HTML
Reference the SVG file directly:
<img src="https://fluenticons.co/icons/ic_fluent_live_off_24_regular.svg" width="24" height="24" alt="Live Off"> 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="M3.28034 2.21968C2.98745 1.92678 2.51257 1.92677 2.21968 2.21966C1.92678 2.51255 1.92677 2.98743 2.21966 3.28032L4.41817 5.47888C1.03184 9.40762 1.20209 15.3442 4.92893 19.0711C5.22183 19.364 5.6967 19.364 5.98959 19.0711C6.28249 18.7782 6.28249 18.3033 5.98959 18.0104C2.84885 14.8697 2.67976 9.88259 5.48231 6.54304L7.25981 8.32057C5.42798 10.6744 5.59383 14.0791 7.75736 16.2426C8.05025 16.5355 8.52513 16.5355 8.81802 16.2426C9.11091 15.9498 9.11091 15.4749 8.81802 15.182C7.24137 13.6053 7.07924 11.1498 8.33164 9.39242L10.5508 11.6116C10.5177 11.7355 10.5 11.8657 10.5 12C10.5 12.8284 11.1716 13.5 12 13.5C12.1343 13.5 12.2645 13.4824 12.3884 13.4492L20.7194 21.7805C21.0123 22.0734 21.4872 22.0734 21.7801 21.7805C22.073 21.4876 22.073 21.0127 21.7801 20.7198L3.28034 2.21968ZM19.3885 16.2068L20.4822 17.3006C22.8997 13.4397 22.4293 8.28717 19.0711 4.92894C18.7782 4.63604 18.3033 4.63604 18.0104 4.92894C17.7175 5.22183 17.7175 5.6967 18.0104 5.9896C20.7791 8.75833 21.2385 12.9619 19.3885 16.2068ZM16.3472 13.1655L17.5252 14.3434C18.4507 12.1592 18.0232 9.53793 16.2426 7.75737C15.9497 7.46447 15.4749 7.46447 15.182 7.75737C14.8891 8.05026 14.8891 8.52513 15.182 8.81803C16.3598 9.99585 16.7482 11.6642 16.3472 13.1655Z" 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/live_off_24_regular.svg";Details
| Name | Live Off |
|---|---|
| Styles | Regular (outlined), Filled |
| Size | 24 × 24 px (scalable SVG) |
| Regular (outlined) file | ic_fluent_live_off_24_regular.svg |
| Filled file | ic_fluent_live_off_24_filled.svg |
| React components | LiveOff24Regular, LiveOff24Filled |
| License | MIT (© Microsoft Corporation) |