Highlight Link icon
Used to highlight content in edit scenarios. The Highlight Link icon is part of Microsoft's Fluent UI System Icons, available here in regular and filled styles on a 20 px grid. Download it as SVG or PNG, or copy it as code — it's free to use under the MIT License.
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, 20 px
ic_fluent_highlight_link_20_regular.svg
Highlight Link icon in React
npm install @fluentui/react-icons
import { HighlightLink20Regular } from "@fluentui/react-icons";
export function Example() {
return <HighlightLink20Regular aria-label="Highlight Link" />;
}Use the Highlight 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 { HighlightLink20Regular, HighlightLink20Filled } from "@fluentui/react-icons";
export function Example() {
return <HighlightLink20Regular aria-label="Highlight Link" />;
}Use it in HTML
Reference the SVG file directly:
<img src="https://fluenticons.co/icons/ic_fluent_highlight_link_20_regular.svg" width="20" height="20" alt="Highlight Link"> Or paste the SVG markup inline. Setting fill="currentColor" makes the icon follow the text color of its parent:
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M3.5 2c.28 0 .5.22.5.5v4c0 .28.22.5.5.5h11a.5.5 0 0 0 .5-.5v-4a.5.5 0 0 1 1 0v4c0 .65-.42 1.2-1 1.41V9a2 2 0 0 1-2 2v1h-1v-1H7v5.7l2-1.01q.04.54.21 1.01l-2.49 1.25A.5.5 0 0 1 6 17.5V11a2 2 0 0 1-2-2V7.91c-.58-.2-1-.76-1-1.41v-4c0-.28.22-.5.5-.5M5 8v1a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V8zm7.5 5a2.5 2.5 0 0 0 0 5h.5a.5.5 0 0 0 0-1h-.5a1.5 1.5 0 0 1 0-3h.5a.5.5 0 0 0 0-1zm3.5 0a.5.5 0 0 0 0 1h.5a1.5 1.5 0 0 1 0 3H16a.5.5 0 0 0 0 1h.5a2.5 2.5 0 0 0 0-5zm-4 2.5c0-.28.22-.5.5-.5h4a.5.5 0 0 1 0 1h-4a.5.5 0 0 1-.5-.5"/></svg>Details
| Name | Highlight Link |
|---|---|
| Styles | Regular (outlined), Filled |
| Sizes | 20 px |
| Regular (outlined) file | ic_fluent_highlight_link_20_regular.svg |
| Filled file | ic_fluent_highlight_link_20_filled.svg |
| React (Regular) | HighlightLink20Regular |
| React (Filled) | HighlightLink20Filled |
| License | MIT (© Microsoft Corporation) |