nfc icon

nfc-fill from MingCute Icon by MingCute Design · Fill · Apache-2.0 Free for personal and commercial use.

Name: nfc-fill
Set: MingCute Icon
Style: Fill
Viewbox: 24×24
License: Apache 2.0

1 other variant in MingCute Icon

The same icon in other sets

nfcHuge Icons nfcLucide nfcMaterial Symbols nfcMaterial Symbols Light nfcMaterial Design Icons nfcSimple Icons nfcTabler Icons

Use the nfc icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M11 3a3 3 0 0 1 3 3v8.586l-1.793-1.793a1 1 0 1 0-1.414 1.414l3.5 3.5A1 1 0 0 0 16 17V6a4.98 4.98 0 0 0-1-3h3a3 3 0 0 1 3 3v12a3 3 0 0 1-3 3h-5a3 3 0 0 1-3-3V9.414l1.793 1.793a1 1 0 1 0 1.414-1.414l-3.5-3.5A1 1 0 0 0 8 7v11c0 1.126.372 2.164 1 3H6a3 3 0 0 1-3-3V6a3 3 0 0 1 3-3z"/></svg>

React

import type { SVGProps } from "react";

export function MingcuteNfcFill(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M11 3a3 3 0 0 1 3 3v8.586l-1.793-1.793a1 1 0 1 0-1.414 1.414l3.5 3.5A1 1 0 0 0 16 17V6a4.98 4.98 0 0 0-1-3h3a3 3 0 0 1 3 3v12a3 3 0 0 1-3 3h-5a3 3 0 0 1-3-3V9.414l1.793 1.793a1 1 0 1 0 1.414-1.414l-3.5-3.5A1 1 0 0 0 8 7v11c0 1.126.372 2.164 1 3H6a3 3 0 0 1-3-3V6a3 3 0 0 1 3-3z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M11 3a3 3 0 0 1 3 3v8.586l-1.793-1.793a1 1 0 1 0-1.414 1.414l3.5 3.5A1 1 0 0 0 16 17V6a4.98 4.98 0 0 0-1-3h3a3 3 0 0 1 3 3v12a3 3 0 0 1-3 3h-5a3 3 0 0 1-3-3V9.414l1.793 1.793a1 1 0 1 0 1.414-1.414l-3.5-3.5A1 1 0 0 0 8 7v11c0 1.126.372 2.164 1 3H6a3 3 0 0 1-3-3V6a3 3 0 0 1 3-3z"/></svg>
</template>

CSS

.icon-nfc-fill {
  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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M11%203a3%203%200%200%201%203%203v8.586l-1.793-1.793a1%201%200%201%200-1.414%201.414l3.5%203.5A1%201%200%200%200%2016%2017V6a4.98%204.98%200%200%200-1-3h3a3%203%200%200%201%203%203v12a3%203%200%200%201-3%203h-5a3%203%200%200%201-3-3V9.414l1.793%201.793a1%201%200%201%200%201.414-1.414l-3.5-3.5A1%201%200%200%200%208%207v11c0%201.126.372%202.164%201%203H6a3%203%200%200%201-3-3V6a3%203%200%200%201%203-3z%22%2F%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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M11%203a3%203%200%200%201%203%203v8.586l-1.793-1.793a1%201%200%201%200-1.414%201.414l3.5%203.5A1%201%200%200%200%2016%2017V6a4.98%204.98%200%200%200-1-3h3a3%203%200%200%201%203%203v12a3%203%200%200%201-3%203h-5a3%203%200%200%201-3-3V9.414l1.793%201.793a1%201%200%201%200%201.414-1.414l-3.5-3.5A1%201%200%200%200%208%207v11c0%201.126.372%202.164%201%203H6a3%203%200%200%201-3-3V6a3%203%200%200%201%203-3z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/mingcute/nfc-fill.svg?color=%231a73e8&size=48