share icon

Common uses

• Share button in social media posts
• Export or send functionality
• Link sharing option

Use it in React

npm i @heroicons/react

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

<ShareIcon className="size-6" />

Styles

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

<ShareIcon className="size-6" />

<ShareIcon className="size-6" />

<ShareIcon className="size-6" />

<ShareIcon className="size-6" />

Details

Library

Heroicons (324 icons)

License

MIT

viewBox

0 0 24 24

Keywords

sharesend iconexport iconlink iconforward icon

FAQ

What is the purpose of the share icon?

It visually signifies an action that allows users to distribute content, links, or information to other platforms or individuals.

How do I use the share icon in React?

Import it from Heroicons like this: `import { ShareIcon } from '@heroicons/react/24/outline'` and then use it as a component: `<ShareIcon />`.

What is the license for the Heroicons share icon?

The Heroicons library, including the share icon, is available under the MIT license.

Related icons

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