Posts

Showing posts from April, 2025

QR generator

import React, { useRef, useState } from "react"; import QRCodeStyling from "qr-code-styling"; const QRGenerator = () => { const [data, setData] = useState(""); const [fgColor, setFgColor] = useState("#000000"); const [bgColor, setBgColor] = useState("#ffffff"); const [logo, setLogo] = useState(null); const qrRef = useRef(null); const qrCode = useRef(null); const generateQR = () => { const options = { width: 300, height: 300, type: "canvas", data: data, image: logo, dotsOptions: { color: fgColor, type: "rounded" }, backgroundOptions: { color: bgColor }, imageOptions: { crossOrigin: "anonymous", margin: 10 } }; qrCode.current = new QRCodeStyling(options); if (qrRef.current) { qrRef.current.innerHTML = ""; qrCode.current.append(qrRef.current);...