qr code icon

Common uses

• Link to a website or app download
• Display Wi-Fi network credentials
• Share contact details (vCard)

Use it in React

npm i @heroicons/react

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

<QrCodeIcon className="size-6" />

Styles

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

<QrCodeIcon className="size-6" />

<QrCodeIcon className="size-6" />

<QrCodeIcon className="size-6" />

<QrCodeIcon className="size-6" />

Details

Library

Heroicons (324 icons)

License

MIT

viewBox

0 0 24 24

Keywords

qrcodebarcodescanlinkinformation

FAQ

What is this icon for?

This icon represents a QR code, a type of two-dimensional barcode. It's used to quickly share information or link to digital content.

How do I use this icon in React?

Import it from Heroicons like this: import { QrCodeIcon } from '@heroicons/react/24/outline'. You can then use it as a React component.

What is the license for this icon?

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

Related icons

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