Accept Direct UPI Payments.
Zero Gateways. Zero Commissions.
@omkarbhosale/upiqr generates standard UPI payment QR codes on the client with automatic transaction splitting for payments above ₹2,000 to bypass merchant interchange fees.
Try it Live
Test single or split QR generation with real-time Zod 4 validation:
Interactive UPI QR StudioLive v3.0.0
Simulate live QR generation & transaction splitting directly in your browser
Ready to Generate
Adjust parameters on the left and click Generate to see the base64 QR Data URL and split chunks live.
What's New in Version 3.0.0
Engineered from the ground up for production fintech and high-volume merchant checkout flows.
Transaction Splitting (₹1,999)
Splits amounts > ₹2,000 into ₹1,999 intervals (e.g. ₹5,000 becomes ₹1,999 + ₹1,999 + ₹1,002). Helps merchants bypass PPI interchange fees under NPCI guidelines.
End-to-End Zod 4 Validation
Strict runtime parameter validation for UPI IDs (`/^[\w.-]+@[\w.-]+$/`), positive amounts, and boundaries before generating any QR code.
Paise-Level Integer Math
Calculates chunks in integer paise (`Math.round(AMOUNT * 100)`) preventing floating-point IEEE-754 rounding drift on high-volume checkouts.
Transaction Metadata
Pass payee name (`name`), custom transaction notes (`note`), and currency (`currency`). Split parts automatically append `(Part X/Y)`.
60-Second Quickstart
Get up and running with named imports in any modern ES Module, Next.js, or TypeScript app:
1. Generating a Single QR Code
import { generateQR } from "@omkarbhosale/upiqr";
// Generate a single UPI QR Data URL
const qrDataUrl = await generateQR({
UPI_ID: "merchant@okhdfcbank",
AMOUNT: 750,
name: "Omkar Store",
note: "Order #9821",
});
// Use directly in an <img> tag or React <Image />
console.log(qrDataUrl); // data:image/png;base64,...2. Splitting a High-Value Payment
import { splitTransactionQR } from "@omkarbhosale/upiqr";
// Automatically splits ₹5,000 into ₹1,999 + ₹1,999 + ₹1,002
const qrs = await splitTransactionQR({
UPI_ID: "store@upi",
AMOUNT: 5000,
name: "Omkar Store",
note: "Order #9821",
});
console.log(qrs);
// [
// { id: "4a236fad...", amount: 1999, image: "data:image/png;base64,..." },
// { id: "c19ba6ae...", amount: 1999, image: "data:image/png;base64,..." },
// { id: "3c44b4ad...", amount: 1002, image: "data:image/png;base64,..." }
// ]import upiqr from "@omkarbhosale/upiqr" remain 100% backward-compatible!Feature Comparison
Choose the right function based on your payment value and checkout structure:
| Feature | generateQR() | splitTransactionQR() |
|---|---|---|
| Primary Purpose | Single instant UPI QR | Chunked payment under ₹2k threshold |
| Return Type | Promise<string> (Base64) | Promise<SplitQRItem[]> |
| Maximum Amount | ₹1,00,000 | ₹10,00,000 |
| Auto Chunking | No | Yes (₹1,999 default) |
| Note Suffix | As passed | Appends (Part X/Y) |
Why Client-Side Payments?
Traditional gateways charge 2% to 3% on every order. With direct UPI QR codes, 100% of the funds go straight into your bank account.
No server keys, webhooks, or merchant account approvals. Generates client-side base64 images ready to render anywhere.
QR codes are created asynchronously in milliseconds. Multiple split chunks are rendered concurrently via Promise.all.