Music Note Off 2 icon

Use the Music Note Off 2 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 { MusicNoteOff224Regular, MusicNoteOff224Filled } from "@fluentui/react-icons";

export function Example() {
  return <MusicNoteOff224Regular aria-label="Music Note Off 2" />;
}

Use it in HTML

Reference the SVG file directly:

<img src="https://fluenticons.co/icons/ic_fluent_music_note_off_2_24_regular.svg" width="24" height="24" alt="Music Note Off 2">

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.5 9.56079V15.6273C7.93308 15.2319 7.24362 15 6.5 15C4.567 15 3 16.567 3 18.5C3 20.433 4.567 22 6.5 22C8.433 22 10 20.433 10 18.5C10 18.4426 9.99862 18.3856 9.99589 18.3289C9.99861 18.303 10 18.2766 10 18.25V11.0608L13.5519 14.6128C13.2026 15.1573 13 15.805 13 16.5C13 18.433 14.567 20 16.5 20C17.195 20 17.8426 19.7974 18.3872 19.4482L20.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.21968C2.98745 1.92678 2.51257 1.92677 2.21968 2.21966C1.92678 2.51255 1.92677 2.98743 2.21966 3.28032L8.5 9.56079ZM17.2809 18.3418C17.041 18.4437 16.7771 18.5 16.5 18.5C15.3954 18.5 14.5 17.6046 14.5 16.5C14.5 16.2229 14.5563 15.959 14.6582 15.7191L17.2809 18.3418ZM6.5 16.5C7.60457 16.5 8.5 17.3954 8.5 18.5C8.5 19.6046 7.60457 20.5 6.5 20.5C5.39543 20.5 4.5 19.6046 4.5 18.5C4.5 17.3954 5.39543 16.5 6.5 16.5ZM16.5 13C16.3972 13 16.2954 13.0044 16.1949 13.0131L19.9869 16.8052C19.9956 16.7046 20 16.6028 20 16.5C20 16.4427 19.9986 16.3856 19.9959 16.329C19.9986 16.303 20 16.2767 20 16.25V2.75001C20 2.51293 19.8879 2.28981 19.6977 2.14829C19.5075 2.00677 19.2616 1.96351 19.0345 2.03164L9.03449 5.03164C8.83589 5.09121 8.67648 5.22793 8.58502 5.4031L10 6.81811V6.30803L18.5 3.75803V6.19198L11.4799 8.29802L12.6845 9.50268L18.5 7.75803V13.6273C17.9331 13.2319 17.2436 13 16.5 13Z" 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/music_note_off_2_24_regular.svg";

Details

Keywords

concertmusicianartevent