> ## Documentation Index
> Fetch the complete documentation index at: https://developer.tazapay.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Converting the QR code to image

> Steps to convert the API qr_code response into a renderable image

1. **Get QR Code**
   Get the `qr_code` value from the API response.
2. **Basic Decode**
   Decode the `qr_code` data, which is encoded using Base64.
   Example, in JS:
   ```jsx theme={null}
   const decodedQrCode = window.atob(qr_code);
   ```
3. **Convert to QR Image URL**
   Use any known method in your programming language, or an external library, to convert `decodedQrCode` into a QR image URL.
   Example using the [qrcode](https://www.npmjs.com/package/qrcode) npm package (ES6/ES7):
   ```jsx theme={null}
   import QRCode from 'qrcode'
   let qr_url = null;
   // With promises
   QRCode.toDataURL(decodedQrCode)
     .then((url) => {
       console.log(url)
       qr_url = url;
     })
     .catch((err) => {
       console.error(err)
     })
   ```
4. **Render QR Image**
   Set `qr_url` as the `src` attribute of an image element in HTML.
   Example:
   ```jsx theme={null}
   <img
     src={qr_url} // QR image url to render in UI
     class="" // add relevant styles
     alt="QR image"
   />
   ```