ICONYZ
English
Qr Code icon from Health Icons

Qr Code icon

healthicons:qr-code

The Qr Code icon (healthicons:qr-code) is a free SVG icon from the Health Icons set by Resolve to Save Lives. It is drawn on a 48 × 48 grid. Health Icons are released under the MIT license, which allows use in personal and commercial projects. Copy it as SVG, JSX, Vue or Svelte code, or download the SVG file.

Icon set
Health Icons
Author
Resolve to Save Lives
License
MIT
Size
48 × 48
Category
Symbols
Tags
qrcode
Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48"><g fill="currentColor"><path d="M6 9a3 3 0 0 1 3-3h6v2H9a1 1 0 0 0-1 1v6H6zm7 6a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v4a1 1 0 0 1-1 1h-4a1 1 0 0 1-1-1zm1 13a1 1 0 0 0-1 1v4a1 1 0 0 0 1 1h4a1 1 0 0 0 1-1v-4a1 1 0 0 0-1-1zm0-2a1 1 0 1 1 0-2a1 1 0 0 1 0 2"/><path d="M15 23a1 1 0 1 1-2 0a1 1 0 0 1 2 0m0 0a1 1 0 1 1 2 0a1 1 0 0 1-2 0m3 3a1 1 0 1 1 0-2a1 1 0 0 1 0 2"/><path d="M20 24a1 1 0 1 1 0 2a1 1 0 0 1 0-2m0 0a1 1 0 1 1 0-2a1 1 0 0 1 0 2m4 2a1 1 0 1 1 0-2a1 1 0 0 1 0 2"/><path d="M25 27a1 1 0 1 0-2 0a1 1 0 1 0-1 1a1 1 0 1 0 0 2a1 1 0 0 0 0-2a1 1 0 0 0 1-1a1 1 0 1 0 2 0m0 0a1 1 0 1 1 2 0a1 1 0 0 1-2 0m0-4a1 1 0 1 1-2 0a1 1 0 0 1 2 0m0 0a1 1 0 1 1 2 0a1 1 0 0 1-2 0"/><path d="M24 20a1 1 0 1 1 0 2a1 1 0 0 1 0-2m0-2a1 1 0 1 0-1-1a1 1 0 0 0-1-1a1 1 0 1 0 0-2a1 1 0 0 0 0 2a1 1 0 1 0 1 1a1 1 0 0 0 1 1"/><path d="M24 18a1 1 0 1 1 0 2a1 1 0 0 1 0-2m-1 3a1 1 0 1 1-2 0a1 1 0 0 1 2 0m1 11a1 1 0 1 1 0-2a1 1 0 0 1 0 2"/><path d="M23 33a1 1 0 1 1 2 0a1 1 0 0 1-2 0m0 0a1 1 0 1 1-2 0a1 1 0 0 1 2 0m2-2a1 1 0 1 1 2 0a1 1 0 0 1-2 0m2-6a1 1 0 1 0 2 0a1 1 0 0 0-2 0m3-1a1 1 0 1 1 0-2a1 1 0 0 1 0 2"/><path d="M32 24a1 1 0 1 1 0-2a1 1 0 0 1 0 2m0 0a1 1 0 1 1 0 2a1 1 0 0 1 0-2m-2 10a1 1 0 1 1 0-2a1 1 0 0 1 0 2"/><path d="M31 33a1 1 0 1 1 2 0a1 1 0 0 1-2 0m-3-3a1 1 0 1 1 0-2a1 1 0 0 1 0 2"/><path d="M30 30a1 1 0 1 1 0-2a1 1 0 0 1 0 2"/><path d="M31 29a1 1 0 1 1 2 0a1 1 0 0 1-2 0m-4-14a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v4a1 1 0 0 1-1 1h-4a1 1 0 0 1-1-1zM6 39a3 3 0 0 0 3 3h6v-2H9a1 1 0 0 1-1-1v-6H6zM42 9a3 3 0 0 0-3-3h-6v2h6a1 1 0 0 1 1 1v6h2zm0 30a3 3 0 0 1-3 3h-6v-2h6a1 1 0 0 0 1-1v-6h2z"/></g></svg>

How to use the Qr Code icon

React

import { Icon } from "@iconify/react";

<Icon icon="healthicons:qr-code" width="24" />

Vue

<script setup>
import { Icon } from "@iconify/vue";
</script>

<template>
  <Icon icon="healthicons:qr-code" width="24" />
</template>

Svelte

<script>
  import Icon from "@iconify/svelte";
</script>

<Icon icon="healthicons:qr-code" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[healthicons--qr-code]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/healthicons -->
<div class="i-healthicons:qr-code"></div>

Web component

<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>

<iconify-icon icon="healthicons:qr-code"></iconify-icon>

HTML image

<img src="https://iconyz.com/api/public/svg/healthicons/qr-code.svg" alt="Qr Code icon" width="24" height="24">

Related icons in Health Icons

Qr Code icon in other icon sets

Qr Code icon FAQ

Is the Qr Code icon free for commercial use?

Yes. Health Icons are released under the MIT license, which allows use in personal and commercial projects.

How do I use the Qr Code icon in React?

Install @iconify/react and render <Icon icon="healthicons: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/healthicons/qr-code.svg" alt="Qr Code icon">, or paste the SVG code inline to style it with CSS.

Browse all Health Icons →