link slash icon

Common uses

• Button to disable a hyperlink
• Status indicator for a broken URL
• Option to remove an existing link

Use it in React

npm i @heroicons/react

import { LinkSlashIcon } from '@heroicons/react/24/outline';

<LinkSlashIcon className="size-6" />

Styles

Heroicons ships this icon in 4 styles — each its own import:

<LinkSlashIcon className="size-6" />

<LinkSlashIcon className="size-6" />

<LinkSlashIcon className="size-6" />

<LinkSlashIcon className="size-6" />

Details

Library

Heroicons (324 icons)

License

MIT

viewBox

0 0 24 24

Keywords

linkslashunlinkbroken linkinvalid linkno link

FAQ

What does the link slash icon represent?

It signifies a link that is broken, invalid, or has been disabled. It's used to visually communicate that a link is not currently functional or accessible.

How do I use this icon in React?

You can import and use it like this: import { LinkSlashIcon } from '@heroicons/react/24/outline'. Then, render the component where needed.

What is the license for Heroicons?

Heroicons are distributed under the MIT license, allowing for free use in both personal and commercial projects.

Related icons

The same idea in other libraries, and near matches in Heroicons.