phone icon

Common uses

• Contact Us button
• Phone number link
• Call action button

Use it in React

npm i @heroicons/react

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

<PhoneIcon className="size-6" />

Styles

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

<PhoneIcon className="size-6" />

<PhoneIcon className="size-6" />

<PhoneIcon className="size-6" />

<PhoneIcon className="size-6" />

Details

Library

Heroicons (324 icons)

License

MIT

viewBox

0 0 24 24

Keywords

phonetelephonecallcontactcommunication

FAQ

What is the phone icon used for?

It's used to visually indicate communication features, contact details, or the action of making a call.

How do I use the phone icon in React?

Import it using: import { PhoneIcon } from '@heroicons/react/24/outline' and then render it as a component: <PhoneIcon />.

What is the license for Heroicons?

Heroicons are provided under the MIT license, allowing for free use in commercial and non-commercial projects.

Related icons

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