A QR code, for scanning, sharing a link or pairing a device. On a 24×24 grid in stroke, duotone and fill, free under MIT.

DevicesNewv0.7.0Added Updated
Drawn byKeyline Icons
16
20
24 px
32
24px
2px
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
  <path d="M4 3L7 3C7.5523 3 8 3.4477 8 4L8 7C8 7.5523 7.5523 8 7 8L4 8C3.4477 8 3 7.5523 3 7L3 4C3 3.4477 3.4477 3 4 3ZM17 3L20 3C20.5523 3 21 3.4477 21 4L21 7C21 7.5523 20.5523 8 20 8L17 8C16.4477 8 16 7.5523 16 7L16 4C16 3.4477 16.4477 3 17 3ZM17 16L20 16C20.5523 16 21 16.4477 21 17L21 20C21 20.5523 20.5523 21 20 21L17 21C16.4477 21 16 20.5523 16 20L16 17C16 16.4477 16.4477 16 17 16ZM12 7L12 10C12 11.1046 12.8954 12 14 12L17 12M12 21L12 18C12 16.8954 11.1046 16 10 16L7 16M8 12L3 12M3 16L3 21" fill="none"/>
  <path d="M22 12C22 12.5523 21.5523 13 21 13C20.4477 13 20 12.5523 20 12C20 11.4477 20.4477 11 21 11C21.5523 11 22 11.4477 22 12ZM8 21C8 21.5523 7.5523 22 7 22C6.4477 22 6 21.5523 6 21C6 20.4477 6.4477 20 7 20C7.5523 20 8 20.4477 8 21ZM13 3C13 3.5523 12.5523 4 12 4C11.4477 4 11 3.5523 11 3C11 2.4477 11.4477 2 12 2C12.5523 2 13 2.4477 13 3Z" fill="currentColor" stroke="none"/>
</svg>

Also called

What someone searching for this drawing would have typed instead. These are the words the browser's search matches on.

  • qr
  • scan code
  • barcode
  • share link
  • pair device
  • ticket
  • qr code
  • pr code
  • code scan

Related icons

The rest of the qr family first, then the Devices shelf.

FAQ

Answered from qr-code's own facts: its shelf, the weights it was drawn in, its siblings and its dates.

What is the qr-code icon for?
A QR code, for scanning, sharing a link or pairing a device. It is filed under Devices in Keyline Icons, drawn on the same 24×24 grid as the rest of the set. People look for it as qr, scan code, barcode, share link, pair device, ticket, qr code, pr code and code scan, and the browser's search matches all of those.
What styles does the qr-code icon come in?
All three: stroke, duotone and fill. They are drawn from the same geometry, so swapping weight never moves anything.
Is there a square or circle version of qr-code?
No. qr-code is drawn as a bare glyph, and the set has no boxed variant of it.
What other icons go with qr-code?
app-check, app-dot, app-minus, app-plus, app-x and battery, and 12 more, all shown below. They are the Devices shelf: nothing else in the set is named after qr.
How do I import qr-code in React?
<QrCode /> is the component, and the weight decides the module: stroke from "@keyline-icons/react", duotone from "@keyline-icons/react/duotone" and fill from "@keyline-icons/react/fill". It takes the usual SVG props plus a size, so <QrCode size={16} /> and className="size-4" both work, and there is no provider or theme to set up.
Where is the qr-code SVG?
icons/stroke/qr-code.svg, icons/duotone/qr-code.svg and icons/fill/qr-code.svg in the repository, normalised: no wrapper, no ids and no classes to strip out. The tabs above hand you the same drawing as SVG or JSX without the download, and neither needs an install.
When was qr-code added to the set?
Added 9 Sept 2026, and last redrawn 10 Sept 2026. It ships in v0.7.0, so an install at that version or later has it.

Questions about the set rather than about this drawing are answered where they belong. The home page covers what the set is, how the three styles differ, why some icons come boxed and where the Figma file is; installing the set in a shadcn/ui project covers the React package, the CLI and using an icon without React. The MIT licence is stated in the footer of every page.