qr code icon
qr-code-16-solid from HeroIcons by Refactoring UI Inc · Solid 16x16 · MIT Free for personal and commercial use.
- Name
- qr-code-16-solid
- Set
- HeroIcons
- Style
- Solid 16x16
- Viewbox
- 16×16
- License
- MIT
3 other variants in HeroIcons
The same icon in other sets
qr-codeBootstrap Iconsqr-codeCarbonqr-code-outlineFlowbite Iconsqr-code-20-filledFluent UI System Iconsqr-codeHealth Iconsqr-codeHuge Iconsqr-codeIconoirqr-codeIonIconsqr-codeJam Iconsqr-codeLucideqr-codeMage Iconsqr-codeMajesticonsqr-codeMaterial Symbolsqr-codeMaterial Symbols Lightqr-codeOpenMojiqr-codePhosphorqr-codePixelarticonsqr-code-fillRemix Iconqr-code-boldSolarqr-code-outlineTeenyiconsqr-code-outlinedWeUI Icon
Use the qr code icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><g fill="currentColor"><path d="M4.75 4.25a.5.5 0 1 0 0 1a.5.5 0 0 0 0-1"/><path fill-rule="evenodd" d="M2 3.5A1.5 1.5 0 0 1 3.5 2H6a1.5 1.5 0 0 1 1.5 1.5V6A1.5 1.5 0 0 1 6 7.5H3.5A1.5 1.5 0 0 1 2 6zm1.5 0H6V6H3.5z" clip-rule="evenodd"/><path d="M4.25 11.25a.5.5 0 1 1 1 0a.5.5 0 0 1-1 0"/><path fill-rule="evenodd" d="M2 10a1.5 1.5 0 0 1 1.5-1.5H6A1.5 1.5 0 0 1 7.5 10v2.5A1.5 1.5 0 0 1 6 14H3.5A1.5 1.5 0 0 1 2 12.5zm1.5 2.5V10H6v2.5z" clip-rule="evenodd"/><path d="M11.25 4.25a.5.5 0 1 0 0 1a.5.5 0 0 0 0-1"/><path fill-rule="evenodd" d="M10 2a1.5 1.5 0 0 0-1.5 1.5V6A1.5 1.5 0 0 0 10 7.5h2.5A1.5 1.5 0 0 0 14 6V3.5A1.5 1.5 0 0 0 12.5 2zm2.5 1.5H10V6h2.5z" clip-rule="evenodd"/><path d="M8.5 9.417a.917.917 0 1 1 1.833 0a.917.917 0 0 1-1.833 0m0 3.666a.917.917 0 1 1 1.833 0a.917.917 0 0 1-1.833 0M13.083 8.5a.917.917 0 1 0 0 1.833a.917.917 0 0 0 0-1.833m-.917 4.584a.917.917 0 1 1 1.833 0a.917.917 0 0 1-1.833 0m-.916-2.751a.917.917 0 1 0 0 1.833a.917.917 0 0 0 0-1.833"/></g></svg>
React
import type { SVGProps } from "react";
export function HeroiconsQrCode16Solid(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><g fill="currentColor"><path d="M4.75 4.25a.5.5 0 1 0 0 1a.5.5 0 0 0 0-1"/><path fillRule="evenodd" d="M2 3.5A1.5 1.5 0 0 1 3.5 2H6a1.5 1.5 0 0 1 1.5 1.5V6A1.5 1.5 0 0 1 6 7.5H3.5A1.5 1.5 0 0 1 2 6zm1.5 0H6V6H3.5z" clipRule="evenodd"/><path d="M4.25 11.25a.5.5 0 1 1 1 0a.5.5 0 0 1-1 0"/><path fillRule="evenodd" d="M2 10a1.5 1.5 0 0 1 1.5-1.5H6A1.5 1.5 0 0 1 7.5 10v2.5A1.5 1.5 0 0 1 6 14H3.5A1.5 1.5 0 0 1 2 12.5zm1.5 2.5V10H6v2.5z" clipRule="evenodd"/><path d="M11.25 4.25a.5.5 0 1 0 0 1a.5.5 0 0 0 0-1"/><path fillRule="evenodd" d="M10 2a1.5 1.5 0 0 0-1.5 1.5V6A1.5 1.5 0 0 0 10 7.5h2.5A1.5 1.5 0 0 0 14 6V3.5A1.5 1.5 0 0 0 12.5 2zm2.5 1.5H10V6h2.5z" clipRule="evenodd"/><path d="M8.5 9.417a.917.917 0 1 1 1.833 0a.917.917 0 0 1-1.833 0m0 3.666a.917.917 0 1 1 1.833 0a.917.917 0 0 1-1.833 0M13.083 8.5a.917.917 0 1 0 0 1.833a.917.917 0 0 0 0-1.833m-.917 4.584a.917.917 0 1 1 1.833 0a.917.917 0 0 1-1.833 0m-.916-2.751a.917.917 0 1 0 0 1.833a.917.917 0 0 0 0-1.833"/></g></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><g fill="currentColor"><path d="M4.75 4.25a.5.5 0 1 0 0 1a.5.5 0 0 0 0-1"/><path fill-rule="evenodd" d="M2 3.5A1.5 1.5 0 0 1 3.5 2H6a1.5 1.5 0 0 1 1.5 1.5V6A1.5 1.5 0 0 1 6 7.5H3.5A1.5 1.5 0 0 1 2 6zm1.5 0H6V6H3.5z" clip-rule="evenodd"/><path d="M4.25 11.25a.5.5 0 1 1 1 0a.5.5 0 0 1-1 0"/><path fill-rule="evenodd" d="M2 10a1.5 1.5 0 0 1 1.5-1.5H6A1.5 1.5 0 0 1 7.5 10v2.5A1.5 1.5 0 0 1 6 14H3.5A1.5 1.5 0 0 1 2 12.5zm1.5 2.5V10H6v2.5z" clip-rule="evenodd"/><path d="M11.25 4.25a.5.5 0 1 0 0 1a.5.5 0 0 0 0-1"/><path fill-rule="evenodd" d="M10 2a1.5 1.5 0 0 0-1.5 1.5V6A1.5 1.5 0 0 0 10 7.5h2.5A1.5 1.5 0 0 0 14 6V3.5A1.5 1.5 0 0 0 12.5 2zm2.5 1.5H10V6h2.5z" clip-rule="evenodd"/><path d="M8.5 9.417a.917.917 0 1 1 1.833 0a.917.917 0 0 1-1.833 0m0 3.666a.917.917 0 1 1 1.833 0a.917.917 0 0 1-1.833 0M13.083 8.5a.917.917 0 1 0 0 1.833a.917.917 0 0 0 0-1.833m-.917 4.584a.917.917 0 1 1 1.833 0a.917.917 0 0 1-1.833 0m-.916-2.751a.917.917 0 1 0 0 1.833a.917.917 0 0 0 0-1.833"/></g></svg> </template>
CSS
.icon-qr-code-16-solid {
width: 24px;
height: 24px;
background-color: currentColor;
-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cg%20fill%3D%22currentColor%22%3E%3Cpath%20d%3D%22M4.75%204.25a.5.5%200%201%200%200%201a.5.5%200%200%200%200-1%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M2%203.5A1.5%201.5%200%200%201%203.5%202H6a1.5%201.5%200%200%201%201.5%201.5V6A1.5%201.5%200%200%201%206%207.5H3.5A1.5%201.5%200%200%201%202%206zm1.5%200H6V6H3.5z%22%20clip-rule%3D%22evenodd%22%2F%3E%3Cpath%20d%3D%22M4.25%2011.25a.5.5%200%201%201%201%200a.5.5%200%200%201-1%200%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M2%2010a1.5%201.5%200%200%201%201.5-1.5H6A1.5%201.5%200%200%201%207.5%2010v2.5A1.5%201.5%200%200%201%206%2014H3.5A1.5%201.5%200%200%201%202%2012.5zm1.5%202.5V10H6v2.5z%22%20clip-rule%3D%22evenodd%22%2F%3E%3Cpath%20d%3D%22M11.25%204.25a.5.5%200%201%200%200%201a.5.5%200%200%200%200-1%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M10%202a1.5%201.5%200%200%200-1.5%201.5V6A1.5%201.5%200%200%200%2010%207.5h2.5A1.5%201.5%200%200%200%2014%206V3.5A1.5%201.5%200%200%200%2012.5%202zm2.5%201.5H10V6h2.5z%22%20clip-rule%3D%22evenodd%22%2F%3E%3Cpath%20d%3D%22M8.5%209.417a.917.917%200%201%201%201.833%200a.917.917%200%200%201-1.833%200m0%203.666a.917.917%200%201%201%201.833%200a.917.917%200%200%201-1.833%200M13.083%208.5a.917.917%200%201%200%200%201.833a.917.917%200%200%200%200-1.833m-.917%204.584a.917.917%200%201%201%201.833%200a.917.917%200%200%201-1.833%200m-.916-2.751a.917.917%200%201%200%200%201.833a.917.917%200%200%200%200-1.833%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cg%20fill%3D%22currentColor%22%3E%3Cpath%20d%3D%22M4.75%204.25a.5.5%200%201%200%200%201a.5.5%200%200%200%200-1%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M2%203.5A1.5%201.5%200%200%201%203.5%202H6a1.5%201.5%200%200%201%201.5%201.5V6A1.5%201.5%200%200%201%206%207.5H3.5A1.5%201.5%200%200%201%202%206zm1.5%200H6V6H3.5z%22%20clip-rule%3D%22evenodd%22%2F%3E%3Cpath%20d%3D%22M4.25%2011.25a.5.5%200%201%201%201%200a.5.5%200%200%201-1%200%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M2%2010a1.5%201.5%200%200%201%201.5-1.5H6A1.5%201.5%200%200%201%207.5%2010v2.5A1.5%201.5%200%200%201%206%2014H3.5A1.5%201.5%200%200%201%202%2012.5zm1.5%202.5V10H6v2.5z%22%20clip-rule%3D%22evenodd%22%2F%3E%3Cpath%20d%3D%22M11.25%204.25a.5.5%200%201%200%200%201a.5.5%200%200%200%200-1%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M10%202a1.5%201.5%200%200%200-1.5%201.5V6A1.5%201.5%200%200%200%2010%207.5h2.5A1.5%201.5%200%200%200%2014%206V3.5A1.5%201.5%200%200%200%2012.5%202zm2.5%201.5H10V6h2.5z%22%20clip-rule%3D%22evenodd%22%2F%3E%3Cpath%20d%3D%22M8.5%209.417a.917.917%200%201%201%201.833%200a.917.917%200%200%201-1.833%200m0%203.666a.917.917%200%201%201%201.833%200a.917.917%200%200%201-1.833%200M13.083%208.5a.917.917%200%201%200%200%201.833a.917.917%200%200%200%200-1.833m-.917%204.584a.917.917%200%201%201%201.833%200a.917.917%200%200%201-1.833%200m-.916-2.751a.917.917%200%201%200%200%201.833a.917.917%200%200%200%200-1.833%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/heroicons/qr-code-16-solid.svg?color=%231a73e8&size=48
