← Torna agli strumenti

Il tuo Biglietto
da Visita digitale.

Fatti salvare in rubrica in un istante. Crea un QR Code semplice per condividere i tuoi contatti con i clienti in Sardegna senza errori.

Dettagli Contatto

Personalizzazione QR



Anteprima QR

Come si usa?
  • • Scrivi i tuoi dati nel modulo.
  • • Il QR Code si crea da solo mentre scrivi.
  • • Provalo subito con il tuo cellulare.
  • • Scaricalo e usalo dove preferisci.
Sempre con te

Porta i tuoi contatti
ovunque vai.

Scambiare i contatti non è mai stato così facile. Con questo QR Code, i tuoi clienti possono salvarti in rubrica in un secondo, senza dover scrivere nulla a mano. È lo strumento perfetto per professionisti e taxi che vogliono farsi trovare subito e senza errori.

Parliamo del tuo progetto

"La prima impressione è digitale. Assicurati che il tuo biglietto da visita sia all'altezza della tua professionalità."

WebSardinia Strategia
// --- VCARD QR LOGIC WITH STYLING --- const inputs = ['v-name', 'v-surname', 'v-org', 'v-role', 'v-phone', 'v-email', 'v-web', 'v-adr', 'v-note']; const elements = inputs.reduce((acc, id) => { acc[id] = document.getElementById(id); return acc; }, {}); const qrFg = document.getElementById('qr-fg'); const qrBg = document.getElementById('qr-bg'); const qrLogo = document.getElementById('qr-logo'); const qrContainer = document.getElementById('qrcode-container'); const downloadBtn = document.getElementById('download-qr'); let currentStyle = 'classic'; let uploadedLogo = null; const styles = { classic: { dotsOptions: { type: 'square', color: '#000000' }, backgroundOptions: { color: '#ffffff' }, cornersSquareOptions: { type: 'square', color: '#000000' }, cornersDotOptions: { type: 'square', color: '#000000' } }, modern: { dotsOptions: { type: 'rounded', gradient: { type: 'linear', rotation: 0.78, colorStops: [{ offset: 0, color: '#1B3C53' }, { offset: 1, color: '#C17F68' }] } }, backgroundOptions: { color: '#ffffff' }, cornersSquareOptions: { type: 'extra-rounded', color: '#1B3C53' }, cornersDotOptions: { type: 'dot', color: '#C17F68' } }, future: { dotsOptions: { type: 'extra-rounded', gradient: { type: 'radial', colorStops: [{ offset: 0, color: '#38BDF8' }, { offset: 1, color: '#1B3C53' }] } }, backgroundOptions: { color: '#ffffff' }, cornersSquareOptions: { type: 'dot', color: '#1B3C53' }, cornersDotOptions: { type: 'dot', color: '#38BDF8' } }, art: { dotsOptions: { type: 'classy', gradient: { type: 'linear', rotation: 0, colorStops: [{ offset: 0, color: '#C17F68' }, { offset: 1, color: '#F59E0B' }] } }, backgroundOptions: { color: '#FDFBF7' }, // Warm Paper cornersSquareOptions: { type: 'extra-rounded', color: '#C17F68' }, cornersDotOptions: { type: 'square', color: '#C17F68' } } }; const qrCode = new QRCodeStyling({ width: 600, height: 600, type: "canvas", margin: 10, qrOptions: { errorCorrectionLevel: "H" }, imageOptions: { hideBackgroundDots: true, imageSize: 0.5, margin: 10 } }); const buildVCard = () => { const name = elements['v-name'].value || ''; const surname = elements['v-surname'].value || ''; const org = elements['v-org'].value || ''; const role = elements['v-role'].value || ''; const phone = elements['v-phone'].value || ''; const email = elements['v-email'].value || ''; const web = elements['v-web'].value || ''; const adr = elements['v-adr'].value || ''; const note = elements['v-note'].value || ''; let vcard = 'BEGIN:VCARD\nVERSION:3.0\n'; vcard += `FN:${name} ${surname}\nN:${surname};${name};;;\n`; if (org) vcard += `ORG:${org}\n`; if (role) vcard += `TITLE:${role}\n`; if (phone) vcard += `TEL;TYPE=WORK,VOICE:${phone}\n`; if (email) vcard += `EMAIL;TYPE=PREF,INTERNET:${email}\n`; if (adr) vcard += `ADR;TYPE=WORK:;;${adr};;;;\n`; if (web) vcard += `URL:${web}\n`; if (note) vcard += `NOTE:${note}\n`; vcard += 'END:VCARD'; return vcard; }; const generateQR = () => { const vcardData = buildVCard(); const styleOptions = JSON.parse(JSON.stringify(styles[currentStyle])); const updateOptions = { data: vcardData, dotsOptions: { ...styleOptions.dotsOptions }, backgroundOptions: { ...styleOptions.backgroundOptions }, cornersSquareOptions: { ...styleOptions.cornersSquareOptions }, cornersDotOptions: { ...styleOptions.cornersDotOptions }, image: uploadedLogo }; // Sync colors with pickers if (updateOptions.dotsOptions.gradient) { updateOptions.dotsOptions.gradient.colorStops[0].color = qrFg.value; } else { updateOptions.dotsOptions.color = qrFg.value; } updateOptions.backgroundOptions.color = qrBg.value; updateOptions.cornersSquareOptions.color = qrFg.value; updateOptions.cornersDotOptions.color = qrFg.value; qrCode.update(updateOptions); qrContainer.innerHTML = ''; qrCode.append(qrContainer); const canvas = qrContainer.querySelector('canvas'); if (canvas) { canvas.style.maxWidth = '100%'; canvas.style.height = 'auto'; canvas.style.aspectRatio = '1/1'; canvas.style.objectFit = 'contain'; } }; window.setQrStyle = (style, btn) => { currentStyle = style; const styleOptions = styles[style]; // Preset colors based on style if (styleOptions.dotsOptions.color) { qrFg.value = styleOptions.dotsOptions.color; } else if (styleOptions.dotsOptions.gradient) { qrFg.value = styleOptions.dotsOptions.gradient.colorStops[0].color; } if (styleOptions.backgroundOptions.color) { qrBg.value = styleOptions.backgroundOptions.color; } document.querySelectorAll('.style-btn').forEach(b => b.classList.remove('active')); btn.classList.add('active'); generateQR(); }; inputs.forEach(id => elements[id].addEventListener('input', generateQR)); qrFg.addEventListener('input', generateQR); qrBg.addEventListener('input', generateQR); qrLogo.addEventListener('change', (e) => { const file = e.target.files[0]; if (file) { const reader = new FileReader(); reader.onload = (event) => { uploadedLogo = event.target.result; generateQR(); }; reader.readAsDataURL(file); } }); downloadBtn.addEventListener('click', () => { qrCode.download({ name: `vcard-qr-${elements['v-surname'].value || 'contact'}`, extension: "png" }); }); generateQR(); // Initial });