Voicemail icon

Use the Voicemail 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 { Voicemail24Regular, Voicemail24Filled } from "@fluentui/react-icons";

export function Example() {
  return <Voicemail24Regular aria-label="Voicemail" />;
}

Use it in HTML

Reference the SVG file directly:

<img src="https://fluenticons.co/icons/ic_fluent_voicemail_24_regular.svg" width="24" height="24" alt="Voicemail">

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.7488 4C20.9915 4 21.9988 5.00736 21.9988 6.25V17.7546C21.9988 18.9972 20.9915 20.0046 19.7488 20.0046H4.25C3.00736 20.0046 2 18.9972 2 17.7546V6.25C2 5.00736 3.00736 4 4.25 4H19.7488ZM19.7488 5.5H4.25C3.83579 5.5 3.5 5.83579 3.5 6.25V17.7546C3.5 18.1688 3.83579 18.5046 4.25 18.5046H19.7488C20.163 18.5046 20.4988 18.1688 20.4988 17.7546V6.25C20.4988 5.83579 20.163 5.5 19.7488 5.5ZM8 9H15.7482L15.8304 9.00444L16 9C17.6569 9 19 10.3431 19 12C19 13.6569 17.6569 15 16 15C14.3431 15 13 13.6569 13 12C13 11.4537 13.146 10.9415 13.4012 10.5003H10.5988C10.854 10.9415 11 11.4537 11 12C11 13.6569 9.65685 15 8 15C6.34315 15 5 13.6569 5 12C5 10.4023 6.24892 9.09634 7.82373 9.00509L8 9ZM8 10.5C7.17157 10.5 6.5 11.1716 6.5 12C6.5 12.8284 7.17157 13.5 8 13.5C8.82843 13.5 9.5 12.8284 9.5 12C9.5 11.1716 8.82843 10.5 8 10.5ZM16 10.5C15.1716 10.5 14.5 11.1716 14.5 12C14.5 12.8284 15.1716 13.5 16 13.5C16.8284 13.5 17.5 12.8284 17.5 12C17.5 11.1716 16.8284 10.5 16 10.5Z" 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/voicemail_24_regular.svg";

Details

Keywords

tapeplaybackaudiorecordingmessage