Comment Multiple Link icon

Use the Comment Multiple Link 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 { CommentMultipleLink24Regular, CommentMultipleLink24Filled } from "@fluentui/react-icons";

export function Example() {
  return <CommentMultipleLink24Regular aria-label="Comment Multiple Link" />;
}

Use it in HTML

Reference the SVG file directly:

<img src="https://fluenticons.co/icons/ic_fluent_comment_multiple_link_24_regular.svg" width="24" height="24" alt="Comment Multiple Link">

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="M5.00648 5.00686C5.08708 5.00231 5.16827 5 5.25 5H15.75C18.0972 5 20 6.90279 20 9.25V12.8328C20.5437 13.0483 21.0381 13.3614 21.4617 13.7503C21.4869 13.5872 21.5 13.4201 21.5 13.25V9.25C21.5 6.07436 18.9256 3.5 15.75 3.5H7.74996C6.59644 3.5 5.58328 4.10095 5.00648 5.00686ZM19 9.25V12.5589C18.7557 12.5201 18.5052 12.5 18.25 12.5H17.5V9.25C17.5 8.2835 16.7165 7.5 15.75 7.5H5.25C4.2835 7.5 3.5 8.2835 3.5 9.25V15.75C3.5 16.7165 4.2835 17.5 5.25 17.5H6.5V20.2582L10.0187 17.6742C10.0675 18.2259 10.2107 18.7505 10.4319 19.2318L6.98989 21.7595C6.16433 22.3657 5 21.7762 5 20.752V18.9905C3.32189 18.8629 2 17.4608 2 15.75V9.25C2 7.45507 3.45507 6 5.25 6H15.75C17.5449 6 19 7.45507 19 9.25ZM22 17.25C22 15.1789 20.3211 13.5 18.25 13.5L18.1482 13.5068C17.7822 13.5565 17.5 13.8703 17.5 14.25C17.5 14.6642 17.8358 15 18.25 15L18.404 15.0052C19.5748 15.0844 20.5 16.0591 20.5 17.25C20.5 18.4926 19.4926 19.5 18.25 19.5L18.2466 19.5046L18.1448 19.5119C17.779 19.5633 17.4983 19.8783 17.5 20.258C17.5019 20.6722 17.8392 21.0065 18.2534 21.0046V21L18.4523 20.9948C20.4276 20.8913 22 19.2543 22 17.25ZM15.5 14.25C15.5 13.8358 15.1642 13.5 14.75 13.5L14.5508 13.5052C12.5724 13.6087 11 15.2457 11 17.25C11 19.3211 12.6789 21 14.75 21L14.8518 20.9932C15.2178 20.9435 15.5 20.6297 15.5 20.25C15.5 19.8358 15.1642 19.5 14.75 19.5L14.596 19.4948C13.4252 19.4156 12.5 18.4409 12.5 17.25C12.5 16.0074 13.5074 15 14.75 15L14.8518 14.9932C15.2178 14.9435 15.5 14.6297 15.5 14.25ZM19 17.25C19 16.8358 18.6642 16.5 18.25 16.5H14.75L14.6482 16.5068C14.2822 16.5565 14 16.8703 14 17.25C14 17.6642 14.3358 18 14.75 18H18.25L18.3518 17.9932C18.7178 17.9435 19 17.6297 19 17.25Z" 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/comment_multiple_link_24_regular.svg";

Details

Keywords

chatmentiondiscussion