QR Code API

Generate styled QR codes via API with full customization support

Live API Demo

Test the API and see the request/response in real-time

Text or URL

Size (px)

Format

Logo Image (Optional)

Change Image

Upload an image file or enter a URL below

Or Image URL

Advanced Style Options

Dots Color

Dots Style

Corner Square Color

Corner Square Style

Corner Dot Color

Corner Dot Style

Background Color

Error Correction Level

Image Margin

Image Size

API Request

curl -X POST https://qrcode.fun/api/generate-qr-styled \
  -H "Content-Type: application/json" \
  -d '{
    "data": "https://qrcode.fun",
    "width": 300,
    "height": 300,
    "type": "png",
    "margin": 12,
    "dotsOptions": {
      "color": "#000000",
      "type": "square"
    },
    "backgroundOptions": {
      "color": "#ffffff"
    },
    "cornersSquareOptions": {
      "color": "#8564C3",
      "type": "extra-rounded"
    },
    "cornersDotOptions": {
      "color": "#9577D4",
      "type": "dot"
    },
    "qrOptions": {
      "errorCorrectionLevel": "M"
    },
    "image": "https://favicon.im/qrcode.fun",
    "imageOptions": {
      "margin": 0
    }
  }'

API Response

QR code will appear here

API Documentation

Complete API reference for generating styled QR codes

QR Code Generation API

This API uses Canvas to generate QR codes with full styling support, providing consistent results with rich customization options.

POST /api/generate-qr-styled

Body:
{
  "data": "Your text or URL",
  "width": 400,
  "height": 400,
  "type": "png" | "svg",
  "margin": 12,
  "image": "data:image/png;base64,..." | "https://example.com/logo.png",  // Optional
  "imageOptions": {  // Optional, only when image is provided
    "hideBackgroundDots": true,
    "imageSize": 0.4,
    "margin": 3,
    "crossOrigin": "anonymous"
  },
  "qrOptions": {
    "errorCorrectionLevel": "L" | "M" | "Q" | "H"
  },
  "dotsOptions": {
    "color": "#000000",
    "type": "square" | "rounded" | "dots" | "classy" | "classy-rounded"
  },
  "backgroundOptions": {
    "color": "#ffffff"
  },
  "cornersSquareOptions": {
    "color": "#8564C3",
    "type": "square" | "dot" | "extra-rounded"
  },
  "cornersDotOptions": {
    "color": "#9577D4",
    "type": "square" | "dot"
  }
}

Response:
{
  "success": true,
  "data": "data:image/png;base64,..." or "<svg>...</svg>",
  "format": "png" | "svg",
  "options": { /* merged options */ }
}