react-native-qr-kit

A fast, offline, and fully native QR code toolkit for React Native (Android and iOS).
Decode QR codes from images, decode multiple QR codes, decode from base64, and generate QR codes — all locally, with no network required.

---

✨ Features

• Offline: All QR code operations are performed locally on the device.
• Decode from Image: Extract QR code data from any image file.
• Decode from Base64: Decode QR code from a base64-encoded image string.
• Decode Multiple: Detect and decode multiple QR codes in a single image.
• Generate QR Code: Create QR codes as base64 PNG images.
• Native Performance: Built with native Android and iOS code for speed and reliability.
• Easy Integration: Simple API for React Native apps.

Note:
While the library is fully focused on QR codes, decoding other barcode formats may not work reliably on iOS. See #screenshot below for an example.

---

📦 Installation

npm install react-native-qr-kit

or

yarn add react-native-qr-kit

iOS Setup

Run the following commands to install iOS dependencies:

cd ios
pod install

Android Manual Linking (if needed)

If autolinking does not work, add the package manually in your MainApplication.java/kt:

import com.qrkit.QRKitPackage; // <-- add this import

@Override
protected List<ReactPackage> getPackages() {
  return Arrays.<ReactPackage>asList(
    // ...other packages
    new QRKitPackage() // <-- add this line
  );
}

---

📋 Usage

decodeBase64

Decodes a QR code from a base64-encoded image string.(e.g., "iVBORw0KGgo...")

Example:

import QRKit from 'react-native-qr-kit';

const decodeBase64 = async (base64String) => {
  try {
    const result = await QRKit.decodeBase64(base64String);
    if (result.success) {
      console.log('QR Code Data:', result.data);
    } else {
      console.error('Error:', result.message);
    }
  } catch (error) {
    console.error('Unexpected Error:', error);
  }
};

Expected Response:

{
  success: true,
  data: string
}
// or on failure
{
  success: false,
  message: string
}

---

decodeQR

Decodes a QR code from a local file path.

Example:

import QRKit from 'react-native-qr-kit';

const decodeQR = async (ImagePath) => {
  try {
    const result = await QRKit.decodeQR(ImagePath);
    if (result.success) {
      console.log('QR Code Data:', result.data);
    } else {
      console.error('Error:', result.message);
    }
  } catch (error) {
    console.error('Unexpected Error:', error);
  }
};

For image choose:

• you can use any library for select image, but i suggest react-native-image-picker

Expected Response:

{
  success: true,
  data: string,         // QR code content
  error: null,
  format: string,       // QR code format (e.g. 'QR_CODE')
  points: string[]      // Array of detected points (e.g. ["120.0,45.0", ...])
}
// or on failure
{
  success: false,
  errorType: string,
  message: string,
  details?: string,
  stack?: string
}

---

decodeMultiple

Decodes multiple QR codes from a local file path.

Example:

import QRKit from 'react-native-qr-kit';

const decodeMultiple = async (ImagePath) => {
  try {
    const result = await QRKit.decodeMultiple(ImagePath);
    if (result.success) {
      console.log('QR Codes:', result.results);
    } else {
      console.error('Error:', result.message);
    }
  } catch (error) {
    console.error('Unexpected Error:', error);
  }
};

For image choose:

• you can use any library for select image, but i suggest react-native-image-picker

Expected Response:

{
  success: true,
  results: [
    { data: string, format: string },
    ...
  ]
}
// or on failure
{
  success: false,
  message: string
}

---

generateQRCode

Generates a QR code as a base64 PNG image.

Example:

import QRKit from 'react-native-qr-kit';

const generateQRCode = async (data, size) => {
  try {
    const result = await QRKit.generateQRCode(data, size);
    if (result.success) {
      console.log('Generated QR Code (Base64):', result.base64);
    } else {
      console.error('Error:', result.message);
    }
  } catch (error) {
    console.error('Unexpected Error:', error);
  }
};

Expected Response:

{
  success: true,
  base64: string // PNG image as base64
}
// or on failure
{
  success: false,
  message: string
}

---

📋 API Reference

decodeQR(path: string): Promise<DecodeResult>

Decode a QR code from a local image file path.

Returns:

{
  success: true,
  data: string,         // QR code content
  error: null,
  format: string,       // QR code format (e.g. 'QR_CODE')
  points: string[]      // Array of detected points (e.g. ["120.0,45.0", ...])
}
// or on failure
{
  success: false,
  errorType: string,
  message: string,
  details?: string,
  stack?: string
}

decodeBase64(base64Str: string): Promise<DecodeResult>

Decode a QR code from a base64-encoded image string.

Returns:

{
  success: true,
  data: string
}
// or on failure
{
  success: false,
  message: string
}

decodeMultiple(path: string): Promise<MultiDecodeResult>

Decode multiple QR codes from a local image file path.

Returns:

{
  success: true,
  results: [
    { data: string, format: string },
    ...
  ]
}
// or on failure
{
  success: false,
  message: string
}

generateQRCode(data: string, size: number): Promise<GenerateResult>

Generate a QR code as a base64 PNG image.

Returns:

{
  success: true,
  base64: string // PNG image as base64
}
// or on failure
{
  success: false,
  message: string
}

---

Screenshots

WhatsApp.Video.2025-08-24.at.1.03.02.PM.mp4

Screen.Recording.2025-09-23.at.3.16.28.PM.mp4

---

ℹ️ Notes

• All QR code decoding and generation is performed offline and locally on the device.
• The library is fully focused on QR codes. Decoding other barcode formats may not work reliably on iOS.
• Works with any local image file path accessible to your app.

---

📄 License

MIT © getsettalk