Qr Code icon
cil:qr-code
The Qr Code icon (cil:qr-code) is a free SVG icon from the CoreUI Free set by creativeLabs Łukasz Holeczek. It is drawn on a 512 × 512 grid. CoreUI Free icons are released under the CC BY 4.0 license, which allows use in personal and commercial projects as long as you credit the author. Copy it as SVG, JSX, Vue or Svelte code, or download the SVG file.
- Icon set
- CoreUI Free
- Author
- creativeLabs Łukasz Holeczek
- License
- CC-BY-4.0
- Size
- 512 × 512
- Tags
- qrcode
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path fill="currentColor" d="M48 48h128V16H16v160h32z"/><path fill="currentColor" d="M176 176V80H80v96zm-64-64h32v32h-32Zm216-64h136v128h32V16H328z"/><path fill="currentColor" d="M432 176V80h-96v96zm-64-64h32v32h-32ZM176 464H48V336H16v160h160z"/><path fill="currentColor" d="M176 336H80v96h96zm-32 64h-32v-32h32Zm320 64H328v32h168V336h-32z"/><path fill="currentColor" d="M272 304h128v64h32v-96H272z"/><path fill="currentColor" d="M432 432v-32H240V272H80v32h128v128zM208 80h32v96h-32z"/><path fill="currentColor" d="M80 240h224V80h-32v128H80zm256-32h96v32h-96zm0 128h32v32h-32zm-64 0h32v32h-32z"/></svg>
How to use the Qr Code icon
React
import { Icon } from "@iconify/react";
<Icon icon="cil:qr-code" width="24" />
Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="cil:qr-code" width="24" />
</template>
Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="cil:qr-code" width="24" />
Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[cil--qr-code]"></span>
UnoCSS
<!-- @unocss/preset-icons + @iconify-json/cil -->
<div class="i-cil:qr-code"></div>
Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="cil:qr-code"></iconify-icon>
HTML image
<img src="https://iconyz.com/api/public/svg/cil/qr-code.svg" alt="Qr Code icon" width="24" height="24">
Qr Code icon in other icon sets
Qr Code icon FAQ
Is the Qr Code icon free for commercial use?
Yes. CoreUI Free icons are released under the CC BY 4.0 license, which allows use in personal and commercial projects as long as you credit the author.
How do I use the Qr Code icon in React?
Install @iconify/react and render <Icon icon="cil:qr-code" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Qr Code icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/cil/qr-code.svg" alt="Qr Code icon">, or paste the SVG code inline to style it with CSS.
Browse all CoreUI Free icons →
ICONYZ
