What does the lifebuoy icon represent?

It represents a life preserver, symbolizing help, support, or emergency assistance.

How do I use the lifebuoy icon in React?

You can import it using `import { LifebuoyIcon } from '@heroicons/react/24/outline'` and then use it as a React component.

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

Heroicons · lifebuoy · MIT

The Heroicons lifebuoy icon depicts a life preserver, commonly used to represent help, support, or emergency assistance features in a user interface.

Install

npm i @heroicons/react

Import & render

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

<LifebuoyIcon className="size-6" />

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

24/outline

<LifebuoyIcon className="size-6" />

24/solid

<LifebuoyIcon className="size-6" />

20/solid

<LifebuoyIcon className="size-6" />

16/solid

<LifebuoyIcon className="size-6" />

What does the lifebuoy icon represent?: It represents a life preserver, symbolizing help, support, or emergency assistance.
How do I use the lifebuoy icon in React?: You can import it using `import { LifebuoyIcon } from '@heroicons/react/24/outline'` and then use it as a React component.
What is the license for this icon?: The Heroicons library, including the lifebuoy icon, is available under the MIT license.

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

The search behind these pages runs as a Claude Code skill. What skills are and how I ship them →